onloadイベントが発生するまでIEでonresizeイベントを呼び出す問題を解決します

Internet Explorerには、ドキュメントが完全にロードされたときにのみonresizeイベントを呼び出すという奇妙なことがあります(多くの1つ)。 この問題はIE 6、7、8に存在します。この不名誉を克服し、透過的に実行したいという要望がありました。



jQueryとその特別なイベントの内部メカニズムを使用しているため、ドキュメントの読み込み中にonresizeを使用して、すべてをその場所に戻すことができます。



特別なイベントのメカニズムを説明しないために、 リンクを添付します



そして実際のコード:



( function ($, resize){

if ($.browser.msie) {

var



// Boolean ,

documentIsLoaded,



/*

* jQuery window

* onload

*/

$window = $(window).one( "load" , function (){

// , 1 (true)

documentIsLoaded = 1;

});



// onresize

function backToNative () {

$. event .special[resize] = undefined;

var events = $window.data( "events" ),

// , .

eventStack = events && events[resize];

// , .

if (eventStack) {

events[resize] = undefined;

}

// onresize, addEventListener/attachEvent

$window.one(resize, $.noop);

// , .

if (eventStack) {

events[resize] = eventStack;

}

}



// special jQuery

$. event .special[resize] = {

setup: function () {

if (documentIsLoaded) {

backToNative();

// false

return !documentIsLoaded;

}

var

// setInterval

checking,

//

prevWidth = $window.width(),

//

prevHeight = $window.height();



//

( function handler (){

if (documentIsLoaded) {

window.clearInterval(checking);

backToNative();

return ;

}



var

width = $window.width(),

height = $window.height();



/*

*

* ,

*/

if (width != prevWidth || height != prevHeight) {

prevWidth = width;

prevHeight = height;

$window.trigger(resize);

}



// ,

if (!checking) {

checking = window.setInterval(handler, 100);

}

})();

},

teardowm: $.noop

};

}

})(jQuery, "resize" );




* This source code was highlighted with Source Code Highlighter .








そして、ドキュメントをロードする前とロードした後の両方で、ハンドラを安全に割り当てることができます。

var count1 = 1;

jQuery(window).resize( function (){

alert(count1++);

});

var count2 = 10;

jQuery(window).bind( "resize" , function (){

alert((count2 += 10));

});




* This source code was highlighted with Source Code Highlighter .








PySuはjQuery 1.4.2のバージョンを使用しました

jQuery 1.4.2のPySySyは、次の理由により機能しません。 新しいバージョンでは、イベント委任システムが変更されました。 近い将来、新しいバージョンとの互換性のある修正プログラムが公開されます。



アイテムのUPD onresize

$( "Div")。サイズ変更(関数(){

console.log( "width:" + $(this).width()+ "、height:" + $(this).height()+ ");

});



https://code.google.com/p/jresizeevent/






All Articles