js弹出层正中
日期：2014-05-16 浏览次数：20312 次
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>OpenBox</title>
</head>
<style type="text/css">
body{font-size:14px;}
.openbox_bg,.openbox{position:absolute; display:none;}
.openbox_bg{left:0; top:0; background:#000; width:100%; height:100%; filter:alpha(opacity=60); opacity:0.6; z-index:99; }
.openbox{top:50%; left:50%; margin:-180px 0 0 -350px; width:700px; height:360px; background:#FFF; z-index:100;}
.openbox a{float:right; margin:5px 5px 0 0;}
</style>
<script type="text/javascript">
function G(id) {
return document.getElementById(id);
}
function openbox(url) {
G("openbox").style.display = "block";
G("openbox_bg").style.display = "block";
if (url != '') {
G("openbox_iframe").src = url;
}
}
function closebox() {
G("openbox").style.display = "none";
G("openbox_bg").style.display = "none";
G("openbox_iframe").src = "about:blank";
}
</script>
<body>
<a href="#" mce_href="#" onclick="openbox('http://baidu.com')">打开弹出层</a>
<!-- openbox -->
<div id="openbox_bg" class="openbox_bg"></div>
<div class="openbox" id="openbox">
<a href="#" mce_href="#" onclick="closebox()">关闭</a>
<iframe id="openbox_iframe" width="100%" height="100%" frameborder="0" scrolling="no" src="about:blank"></iframe>
</div>
<!-- openbox end -->
</body>
</html>
?
