Gaurav Handoo
Forum Replies Created
-
Hi, I’ve been trying to do something similar and followed the steps mentioned above for placing the CSS and JS but still couldn’t get it work can u help me out. Following is the sample of what my codes look like:
<<-----Parent Page--->>
<head>
CSS for overlay div and other content in the page
</head>
<body>
<div id="parentdiv" class="parentdiv">
<div style="float:left;" id="xtrnlpg">
<iframe src="TestPage.htm" class="inlinepage"></iframe>
</div>
<div style="float:left;">This is sample text</div>
<div class="overlay displaynone" id="overlay"></div>
</div>
</body><<------Page called in Iframe---->>
<head>
<script>
function popuplaunch() {
document.getElementById("popupdiv").style.display = "block";
top.document.getElementById("overlay").style.display = "block";
}
</script>
<style type="text/css">
.popupdiv
{
display:none;
padding-top:35%;
padding-left:20%;
z-index:1100;
}
</style>
</head>
<body>
<button id="popupbtn" onclick="popuplaunch();">
Pop Up Button
</button>
<div class="popupdiv" id="popupdiv">
This is a test popup
<button id="popupclose" onclick="popupclose();">
Close Popup
</button>
</div>
</body>