Hide URL in Popup Window with window.open
By Tan Lee Published on Feb 08, 2025 381
If you're using the window.open() method to open a popup on your website, the URL of the opened window often appears in the address bar.
If you'd prefer to hide this URL from your users, here’s an approach you can follow.
window.open("myPopupWindow.html", "_blank", "height=400, width=550, status=yes, toolbar=no, menubar=no, location=no, addressbar=no, top=200, left=300");In case you're trying to hide the address bar to make the popup look cleaner or to prevent users from seeing the direct URL, you might not want them to know they can access the content outside of the popup.
One approach is to load the page inside an iframe within the popup. This way, the user sees only the content inside the iframe, and the URL remains hidden.
window.open('http://xyz.com/welcome.html');Then, in your welcome.html, you can include this code:
<html>
<body>
<iframe src="/hiddenContent.html" style="border:none; width:100%; height:100%;"></iframe>
</body>
</html>This ensures that the content in /hiddenContent.html is loaded within the iframe, and users won't see the actual URL of the page in the address bar.
If you prefer opening a new tab instead of a popup, you can use the following code:
window.open('', '_blank').location.href = "newPage.html";This will open a new tab and direct it to the newPage.html URL.
- How to use sweetalert2
- How to Pass string parameter in an onclick function
- How to format number with commas and decimal in Javascript
- What does 'use strict;' means in Javascript
- How to detect if caps lock is pressed in Javascript
- How to create a Custom Event in Javascript
- How to Check if an Object Has a Property Properly in JavaScript
- How to convert an Uint8Array to string in Javascript
Categories
Popular Posts
Portal HTML Bootstrap
Nov 13, 2024
Freedash bootstrap lite
Nov 13, 2024
Motiv MUI React Admin Dashboard Template
Nov 19, 2024
K-WD Tailwind CSS Admin Dashboard Template
Nov 17, 2024