当前位置:编程学习 > JAVA >>

解决IE6下resize事件执行多次的问题

在IE浏览器下,一次resize事件被执行了多次。这是IE6和IE7的一个比较广为认知的问题,这个问题在这两个版本的浏览器中表现有所不同,通常IE6下会比IE7下更为糟糕。
 
现在已经有了一个较好的解决方案,让jquery.wresize.js这个jquery插件来帮你:
 
Js代码 
/*   
=============================================================================== 
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:
Js代码 
<!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/199

补充:web前端 , JavaScript ,
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,