I would like to insert some PHP to display the popup box. I have the following HTML/CSS/Javascript code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style>
.poppup_overlay{
display: none;
position:fixed;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
background-position:fixed;
z-index:1001;
-moz-opacity: 0.8;
opacity:.80;
filter: alpha(opacity=80);
}
* html .poppup_overlay { /* ie6 hack */
position: absolute;
height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
.poppup_content {
display: none;
position:fixed;
width:450;
height:110;
top: 40%;
left: 35%;
padding: 4px;
border: 3px solid #009933;
background-color: white;
z-index:1002;
overflow: auto;
}
* html .poppup_content { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}
.button {
display:block;
font-weight:normal;
font-size:18px;
font-family:Calibri;
color:#009933;
background-color:#ffffff;
width:100px;
text-decoration:none;
text-align:center;
padding:4px;
border-top: 2px solid #b2b2b2;
border-bottom: 2px solid #b2b2b2;
border-left: 2px solid #b2b2b2;
border-right: 2px solid #b2b2b2;
}
.button:hover,.button:active {
background-color:#fff;
border-color:#009933;
}
</style>
</head>
<body>
<p>
Click <a href="javascript:void(0)" onclick="document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">here</a>
</p>
<div id="light" class="poppup_content">
<table>
<tr>
<td><img src="popname.png" /></td>
</tr>
<tr></tr>
<tr>
<td><font color="#009933" face="calibri">Your message has been successfully sent !</font></td>
<tr></tr>
</tr>
</table>
<p align="right">
<a class="button" href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a>
</p>
</div>
<div id="fade" class="poppup_overlay"></div>
</body>
</html>
You can test it online here
My question is how to integrate this code in php echo, so that php echoes the popup box? If you need more details tell me. Any help will be highly appreciated. Thanks in advance :)
<p>Click <a href = <? echo "javascript:void(0)\" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'\""?>>here</a></p>
Is this is what are you looking for?