摘要:如果在內(nèi)嵌頁面未載入完成時(shí),給出一種加載提示信息。載入?yún)^(qū)域給出友好的提示信息當(dāng)載入完成時(shí),清空提示信息,而讓顯示這些都比較容易,但現(xiàn)在的問題的關(guān)鍵是怎么監(jiān)聽元素內(nèi)的頁面已經(jīng)載入完成。
經(jīng)常會遇到這樣一種情景:
在iframe里嵌入另外一個(gè)頁面時(shí)。如果iframe載入的頁面響應(yīng)較快,或許我們感覺不到頁面載入的不同步,但試想,如果一個(gè)需要內(nèi)嵌到iframe里的頁面的響應(yīng)很慢,這里會出現(xiàn)一種什么現(xiàn)象呢?這時(shí)將會出現(xiàn)所有頁面已經(jīng)載入完成,但在iframe元素處,將會出現(xiàn)空白,直到內(nèi)嵌頁面完成載入時(shí),該空白處才會顯示新載入的頁面。
可想而知,一個(gè)頁面如果長時(shí)間的空白,對于瀏覽者來說將意味著什么。
如果在內(nèi)嵌頁面未載入完成時(shí),給出一種加載提示信息。如:“頁面加載中”之類的,我想這對瀏覽頁面用戶來講,將不再是煎熬,更是一種視覺上的享受。
為了實(shí)現(xiàn)這樣的效果,一般會采用如下原理處理。
iframe載入?yún)^(qū)域給出友好的提示信息
當(dāng)iframe載入完成時(shí),清空提示信息,而讓iframe顯示
這些都比較容易,但現(xiàn)在的問題的關(guān)鍵是怎么監(jiān)聽iframe元素內(nèi)的頁面已經(jīng)載入完成。
關(guān)鍵這個(gè)問題,一般來講,會分兩種情況的來討論解決方案。
同域的嵌套。最好是讓子頁面調(diào)用父頁面的方法
如果是異域,但子頁面無法修改,那么:在Firefox/Opera/Safari中,可以直接使用iframe onload事件;而在IE中,可以通過定時(shí)器測定子頁面的document.readyState,或者使用iframe onreadystatechange事件計(jì)算該事件的響應(yīng)
同域嵌套parent.html function ifrmLoaded() { // code here } sub.html window.onload = function() { window.parent.ifrmLoaded(); }嵌套頁面不能修改,或者異域嵌套
Firefox/Opera/Safari中直接使用iframe onload事件
document.getElementById("ifrm").onload = function() { //here doc }
在IE下,注冊iframe onreadystatechange事件
var oFrm = document.getElementById("ifrm"); oFrm.onreadystatechange = function() { if (this.readyState && this.readyState == "complete") { onComplete(); } }兼容Firefox/Opera/Safari/IE的處理方式
var oFrm = document.getElementById("ifrm"); oFrm.onload = oFrm.onreadystatechange = function() { if (this.readyState && this.readyState != "complete") return; else { onComplete(); } }雙滾動條問題
因?yàn)閕frame默認(rèn)是inline-block元素,空白符被解析,所以無端端出現(xiàn)滾動條 使用iframe時(shí),一般會出現(xiàn)雙滾動條問題,解決方案如下: 1、修改
http://hqlong.com/2009/02/620...
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/50523.html
摘要:如果在內(nèi)嵌頁面未載入完成時(shí),給出一種加載提示信息。載入?yún)^(qū)域給出友好的提示信息當(dāng)載入完成時(shí),清空提示信息,而讓顯示這些都比較容易,但現(xiàn)在的問題的關(guān)鍵是怎么監(jiān)聽元素內(nèi)的頁面已經(jīng)載入完成。 經(jīng)常會遇到這樣一種情景: 在iframe里嵌入另外一個(gè)頁面時(shí)。如果iframe載入的頁面響應(yīng)較快,或許我們感覺不到頁面載入的不同步,但試想,如果一個(gè)需要內(nèi)嵌到iframe里的頁面的響應(yīng)很慢,這里會出現(xiàn)...
摘要:今天,你的瀏覽器滾動了嗎序在頁面中,一個(gè)有高度或者寬度的容器是最常見的構(gòu)成元素,而在其中的子元素有很大的概率超過父容器的尺寸限制,我們稱之為溢出。 今天,你的瀏覽器 滾動 了嗎? 序 在 Web 頁面中,一個(gè)有高度或者寬度的容器是最常見的構(gòu)成元素,而在其中的子元素有很大的概率超過父容器的尺寸限制,我們稱之為溢出。而應(yīng)對溢出,隱藏或者滾動是最常見的處理方式。滾動,作為 FEers 最經(jīng)常...
摘要:今天,你的瀏覽器滾動了嗎序在頁面中,一個(gè)有高度或者寬度的容器是最常見的構(gòu)成元素,而在其中的子元素有很大的概率超過父容器的尺寸限制,我們稱之為溢出。 今天,你的瀏覽器 滾動 了嗎? 序 在 Web 頁面中,一個(gè)有高度或者寬度的容器是最常見的構(gòu)成元素,而在其中的子元素有很大的概率超過父容器的尺寸限制,我們稱之為溢出。而應(yīng)對溢出,隱藏或者滾動是最常見的處理方式。滾動,作為 FEers 最經(jīng)常...
閱讀 1622·2019-08-29 13:53
閱讀 3223·2019-08-29 13:50
閱讀 870·2019-08-27 10:51
閱讀 578·2019-08-26 18:36
閱讀 1829·2019-08-26 11:00
閱讀 621·2019-08-26 10:36
閱讀 3231·2019-08-23 17:58
閱讀 2041·2019-08-23 15:17