<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> Test </TITLE> <style type="text/css"> <!-- html,body { height:100%; margin: 0px; font-size: 12px; font-family: FixedSys; } .mydiv { background-color: lightblue; border: 1px solid blue; text-align: center; line-height: 20px; font-size: 12px; font-weight: bold; z-index: 999; 200px; height: 120px; left: 50%; top: 50%; margin-left: 150px!important; margin-top: -60px!important; margin-top: 0px; position: fixed!important; position: absolute; } .bg,.popIframe { background-color: #666; display: none; 100%; height: 100%; left: 0; top: 0; filter: apha(opacity=50); opacity: 0.5; z-index: 1; position:fixed!important; position: absolute; } .popIframe { filter: alpha(opacity=0); opacity:0; } --> </style> <SCRIPT LANGUAGE="JavaScript"> <!-- function showDiv() { document.getElementById('popDiv').style.display = 'block'; document.getElementById('popIframe').style.display = 'block'; document.getElementById('bg').style.display = 'block'; } function closeDiv() { document.getElementById('popDiv').style.display = 'none'; document.getElementById('popIframe').style.display = 'none'; document.getElementById('bg').style.display = 'none'; } //--> </SCRIPT> </HEAD> <BODY> <div class="mydiv" id='popDiv' style="display: none"> Hello world!<br/> <a href="javascript:closeDiv();">Close Div</a></div> <div id="bg" class="bg" style="display: none;"></div> <a href="javascript:showDiv();">Show Div<//a> <iframe id="popIframe" class="popIframe" frameborder="0"></iframe> </BODY> </HTML>