How to open a link in a pop up iframe window?
How to open a link in a pop up iframe window?
1 answer
by
aubrey ,
2 months ago
@dedrick
To open a link in a pop-up iframe window, you can use the following HTML code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
<!DOCTYPE html>
<html>
<head>
<style>
.popup {
display: none;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
border: 1px solid #ccc;
padding: 10px;
background: #fff;
z-index: 9999;
}
</style>
</head>
<body>
<a href="#" id="open-popup">Open Popup</a>
<div class="popup" id="popup">
<iframe src="https://example.com" width="400" height="300"></iframe>
<button id="close-popup">Close</button>
</div>
<script>
document.getElementById('open-popup').onclick = function() {
document.getElementById('popup').style.display = "block";
}
document.getElementById('close-popup').onclick = function() {
document.getElementById('popup').style.display = "none";
}
</script>
</body>
</html>
|
In this code snippet, when the user clicks on the "Open Popup" link, a pop-up iframe window will appear with the content from the specified URL. The pop-up window can be closed by clicking the "Close" button. You can customize the styling and functionality of the pop-up window as needed.