標籤:javascript
執行個體011 彈出全螢幕顯示的網頁強制回應對話方塊執行個體說明彈出全螢幕顯示的網頁強制回應對話方塊,使用者關閉之前不能瀏覽網站的其他內容。技術要點 本執行個體主要應用screen對象的width、height屬性和window對象的showModalDialog()方法實現。其實還有一種方法開啟網頁對話方塊,即showModelessDialog()方法。 使用showModalDialog()與showModelessDialog()方法的區別在於,showModalDialog()開啟的網頁對話方塊為強制回應視窗,置在父視窗上,必須關閉才能訪問父視窗;而showModelessDialog()方法開啟的對話方塊是無強制回應視窗,開啟後不關閉也能訪問父視窗或其他視窗。實現過程(1)實現功能的主視窗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>註:style標籤的內容為css的知識,我們關注的是script標籤內的內容。這樣我們的這個執行個體就做好了。
JavaScript特效執行個體011-彈出全螢幕顯示的網頁強制回應對話方塊