在IE浏览器下，一次resize事件被执行了多次。这是IE6和IE7的一个比较广为认知的问题，这个问题在这两个版本的浏览器中表现有所不同，通常IE6下会比IE7下更为糟糕。
现在已经有了一个较好的解决方案，让jquery.wresize.js这个jquery插件来帮你：
/*
===============================================================================
WResize is the jQuery plugin for fixing the IE window resize bug
...............................................................................
Copyright 2007 / Andrea Ercolino
-------------------------------------------------------------------------------
LICENSE: http://www.opensource.org/licenses/mit-license.php
WEBSITE: http://noteslog.com/
===============================================================================
*/
( function( $ )
{
$.fn.wresize = function( f )
{
version = '1.1';
wresize = {fired: false, width: 0};
function resizeOnce()
{
if ( $.browser.msie )
{
if ( ! wresize.fired )
{
wresize.fired = true;
}
else
{
var version = parseInt( $.browser.version, 10 );
wresize.fired = false;
if ( version < 7 )
{
return false;
}
else if ( version == 7 )
{
//a vertical resize is fired once, an horizontal resize twice
var width = $( window ).width();
if ( width != wresize.width )
{
wresize.width = width;
return false;
}
}
}
}
return true;
}
function handleWResize( e )
{
if ( resizeOnce() )
{
return f.apply(this, [e]);
}
}
this.each( function()
{
if ( this == window )
{
$( this ).resize( handleWResize );
}
else
{
$( this ).resize( f );
}
} );
return this;
};
} ) ( jQuery );
如何使用，请看这个例子test page：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="overflow:hidden;">
<head>
<title> test window resize </title>
<script type="text/javascript" src="http://jquery.com/src/jquery-latest.pack.js"></script>
<script type="text/javascript" src="jquery.wresize.js"></script>
<script type="text/javascript">
jQuery( function( $ )
{
function content_resize()
{
var w = $( window );
var H = w.height();
var W = w.width();
$( '#content' ).css( {width: W-20, height: H-20} );
}
$( window ).wresize( content_resize );
content_resize();
} );
</script>
</head>
<body>
<div id="content" style="border: 1px dashed silver; position:absolute; overflow:auto;">
test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test
</div>
</body>
</html>
原文地址：How to fix the resize event in IE
分享到：
相关推荐
在IE浏览器下，一次resize事件被执行了多次。这是IE6和IE7的一个比较广为认知的问题，这个问题在这两个版本的浏览器中表现有所不同，通常IE6下会比IE7下更为糟糕。 现在已经有了一个较好的解决方案，让jquery....
本文主要通过代码示例给大家介绍IE7浏览器窗口大小改变事件执行多次bug及IE6/IE7/IE8下resize问题；分步介绍，先给大家介绍IE7浏览器窗口大小改变事件执行多次bug，具体问题分析及解决方案请看下文。 var ...
事件 专用事件绑定器 v0.1 Alucelx * http://www.cnblogs.com/Alucelx/archive/2011/10/20/2219263.html * <description> * 用于解决 lte ie8 & chrome 及其他可能会出现的 原生 window.resize 事件多次执行的 ...
resize事件是在窗口或框架的大小被调整时发生，包括最小化、最大化。在IE和Opera浏览器中，只要窗口边框被拖动，就触发该事件，在Mozilla浏览器中，resize 事件只是在停止改变窗口大小时才会触发。
[removed] 事件 专用事件绑定器 v0.1,用于解决 lte ie8 & chrome 及其他可能会出现的 原生 window.resize 事件多次执行的 BUG.
同事在项目中使用scroll事件去加载数据，结果IE下悲剧了。给了一个简单优化方法，效果明显。... 基本的优化思路：在一定的时间之内，只执行一次resize事件函数。 代码如下: var resizeTimer = null; $[removed]
[removed] 在IE浏览器下有多次被执行甚至死循环的bug，会导致浏览器卡死 解决方案： 代码如下:// IE浏览器下将onresize事件放在div上if(navigator.userAgent && navigator.userAgent.toLowerCase().indexOf(“msie”...
给tr设置relative后就能相对table定位了，看来很简单啊，但问题是这个方法ie8和ff都无效，而且存在很多问题，所以很快就被抛弃了。 ps：该效果用来做tr的拖动会很方便。 接着想到的是给table插入一个新tr，克隆原来...
如何解决ACCESS中SELECT TOP语句竟然返回多条记录的问题？ Asp.net 利用OleDb的GetOLEDBSchemaTable方法得到数据库架构信息 用于 Visual Studio .Net 的 IBM DB2 开发外接程序 第2章 并发操作的一致性问题 (2) Using...
1350多个精品易语言模块提供下载介绍 1亦思验证码识别1.5免费版.ec 24位转单色位图模块.ec 32张发牌.ec 3D引擎支持库-eOgre.ec 69msn.ec ACCESS 到高级表格.ec Access操作.ec Access数据库压缩修复新建.ec ACCSEE...
禁止程序多次运行.ec 禁止二次运行.ec 禁止重复运行.ec 客户管理模块.ec 控件＋窗口模块.ec 控件大小调整模块.ec 控件自动缩放.ec 控制程序运行天数1.0.ec 控制面板.ec 控制系统音量.ec 酷按钮2.2模块.ec ...
禁止程序多次运行.ec 禁止二次运行.ec 禁止重复运行.ec 客户管理模块.ec 控件＋窗口模块.ec 控件大小调整模块.ec 控件自动缩放.ec 控制程序运行天数1.0.ec 控制面板.ec 控制系统音量.ec 酷按钮2.2模块.ec ...
禁止程序多次运行.ec 禁止二次运行.ec 禁止重复运行.ec 客户管理模块.ec 控件＋窗口模块.ec 控件大小调整模块.ec 控件自动缩放.ec 控制程序运行天数1.0.ec 控制面板.ec 控制系统音量.ec 酷按钮2.2模块.ec ...
ReSize.ec rhmisc.ec ricky52529 编程超级模块.ec RUN++行++模块2.ec RUNONCE.EC runtime.ec RUN加减模块1.0+ 名.ec SAVEPIC.EC Sc千寻专用模块.ec SetIEProxy.ec setuser.ec sev.ec shell.ec SHELL32.EC ShutDown....
界面简洁加载速度快 <br/>由于才有了很多优化方法，所以CuteEditor非常简单、小巧、装载速度快，但仍然保持功能强大、执行效率高的特点。 跨浏览器,跨平台的所见即所得在线html编辑器 ...
//document.writeln ('<dd>06月21日 修复IE6下兼容问题</dd>'); //document.writeln ('<dd>06月01日 懒人图库2012新版上线</dd>'); //document.writeln ('<dd>05月26日 新增北方网通服务器</dd>'); //document....