彈出全屏顯示的網(wǎng)頁模式對話框,用戶關(guān)閉之前不能瀏覽網(wǎng)站的其他內(nèi)容。
本實例主要應用 screen 對象的 width、height 屬性和 window 對象的 showModalDialog()方法實現(xiàn)。其實還有一種方法打開網(wǎng)頁對話框,即 showModelessDialog()方法。
使用 showModalDialog()與 showModelessDialog()方法的區(qū)別在于,showModalDialog()打開的網(wǎng)頁對話框為模式窗口,置在父窗口上,必須關(guān)閉才能訪問父窗口;而 showModelessDialog()方法打開的對話框是無模式窗口,打開后不關(guān)閉也能訪問父窗口或其他窗口。
1.實現(xiàn)功能的主窗口 index.html
<html>
<head>
<meta charset="utf-8" />
<script type="text/jscript" language="javascript">
function pp()
{
var width = screen.width;
var height = screen.height;
var someValue = window.showModalDialog("new.html","","dialogWidth="+width+"px;dialogHeight="+height+"px;status=no;help=no;scrollbars=no")
}
</script>
</head>
<body>
<input type="button" value = "彈出" onclick = "pp()">
</body>
</html>
2.彈出的窗口 new.html
<html>
<head>
<meta charset="utf-8" />
<title>彈出的窗口</title>
<style type="text/css">
body{
background-image:url(new.jpg);
background-repeat:no-repeat;
}
</style>
</head>
<body>
</body>
</html>