打開iframe並摺疊整個頁面

Question

用戶提交表單後，我想打開一個iframe並覆蓋整個屏幕。正常的內容將崩潰，因此只能看到內容豐富的內容。這是如何完成的。簡單地打開iframe會將所有內容放在它之上和之下。

<div id="iWait" style="display:none;"><center><iframe src="http://website.com" width="100%" height="100%"></iframe></center></div> 

Answer 1

請注意，在代碼中定義iframe會導致它在後臺加載。這可能會不必要地拖慢頁面，直到稍後才需要加載頁面。

開始與HTML類似這樣（注意fixed定位）：

<iframe id="preventBoredom" src="http://www.domain.com/" frameborder="0" style="position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 1000; display: none;"></iframe> 

然後，.show()像這樣顯示的：

$('#preventBoredom').show(); 

如果你只希望加載的iframe它揭示了當，將初始iframe src設置爲空白HTML頁面，並使用此jQuery替代：

$('#preventBoredom').src('http://www.domain.com/').show(); 

---

注意在回答@ROY_Finley和@Mort_Goldman：我無法想象一個良好的局面用這個，除非你打算在某個時候再次隱藏的iframe。例如，您可能希望在加載航空公司搜索結果集時保持用戶繁忙（這些通常需要一段時間才能加載）。但是這種方法會讓用戶認爲他們在另一個網站上 - 如果窗戶突然被遮擋，他們會很生氣。

如果表單處理是一個較慢的服務器任務，那麼在繼續處理之前，應該先讓處理腳本關閉輸出。這將允許服務器在後臺完成其工作，而瀏覽器繼續它的快樂方式。