zjshhy 2010-07-22 13:59 采纳率: 100%
浏览 591
已采纳

window.onresize 在页面未完成时无效.(用domReady绑定的方法)

直接上代码：
[code="html"]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



Untitled Document function Show(){ this.init = function (){ domReady(set); } function set(){ if(!window.onresize){ window.onresize = resize; }else{ var old = window.onresize window.onresize = function (){ resize(); old(); } } } function resize(){ //do something alert("resize bind"); } //文档完成时 function domReady(fn){ var _timer_ = null; void function(){ if(document.all){ try{ document.documentElement.doScroll("left"); clearTimeout(_timer_,_timer_ = null, fn()); }catch(e){ _timer_ = setTimeout(arguments.callee,100); } }else{ document.addEventListener("DOMContentLoaded", fn, false); } }() } } function al(){ alert(window.onresize); } var ob = new Show(); ob.init();






[/code]
这个图片很大6百万像素，当我的dom树再在完成，但图片还未下载完成的时候,window.onresize绑定的方法不会被触发。请问有什么替代方案么？很奇怪的是window.onscroll绑定的方法又是可以作用的.
  • 写回答

1条回答 默认 最新

  • kjah_1 2010-07-22 17:04
    关注

    ie确实有此问题,我的解决办法是:
    在页面加载时使用setInterval 一直比较窗口宽度,
    当宽度改变时调用方法,
    页面加载完取消interval.

    代码如下:
    [code="html"]
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


    test1.html

    <!---->
    <br> &lt;!--</p> <pre><code>wresize(function(){alert(2)}); function wresize(fn){ var width,height,interval; window.onresize=fn; window.onload=function(){ if(interval)clearInterval(interval); } interval=setInterval(function(){ var w=getWinSize(); width=width||w.width; height=height||w.height; if(width!=w.width||height!=w.height){ fn(); width=w.width; height=w.height; } },200); } function getWinSize(){ var winW, winH; if(window.innerHeight) { // all except IE winW = window.innerWidth; winH = window.innerHeight; } else if (document.documentElement&amp;&amp;document.documentElement.clientHeight){ // IE 6 Strict Mode winW = document.documentElement.clientWidth; winH = document.documentElement.clientHeight; } else if (document.body){// other winW = document.body.clientWidth; winH = document.body.clientHeight; } return {&quot;width&quot;:winW, &quot;height&quot;:winH}; } </code></pre> <p>//--&gt;<br>




    [/code]

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


    test1.html

    <!---->
    <br> &lt;!--</p> <pre><code>wresize(function(){alert(2)}); function wresize(fn){ var width,height,interval; window.onresize=fn; window.onload=function(){ if(interval)clearInterval(interval); } interval=setInterval(function(){ var w=getWinSize(); width=width||w.width; height=height||w.height; if(width!=w.width||height!=w.height){ fn(); width=w.width; height=w.height; } },200); } function getWinSize(){ var winW, winH; if(window.innerHeight) { // all except IE winW = window.innerWidth; winH = window.innerHeight; } else if (document.documentElement&amp;&amp;document.documentElement.clientHeight){ // IE 6 Strict Mode winW = document.documentElement.clientWidth; winH = document.documentElement.clientHeight; } else if (document.body){// other winW = document.body.clientWidth; winH = document.body.clientHeight; } return {&quot;width&quot;:winW, &quot;height&quot;:winH}; } </code></pre> <p>//--&gt;<br>




    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题？

悬赏问题

  • ¥15 安卓adb backup备份应用数据失败
  • ¥15 eclipse运行项目时遇到的问题
  • ¥15 关于#c##的问题：最近需要用CAT工具Trados进行一些开发
  • ¥15 南大pa1 小游戏没有界面，并且报了如下错误，尝试过换显卡驱动，但是好像不行
  • ¥15 没有证书，nginx怎么反向代理到只能接受https的公网网站
  • ¥50 成都蓉城足球俱乐部小程序抢票
  • ¥15 yolov7训练自己的数据集
  • ¥15 esp8266与51单片机连接问题(标签-单片机|关键词-串口)（相关搜索：51单片机|单片机|测试代码）
  • ¥15 电力市场出清matlab yalmip kkt 双层优化问题
  • ¥30 ros小车路径规划实现不了，如何解决？(操作系统-ubuntu)