最近做项目遇到了经典的IE的resize问题, 估计好多浏览器假死现象都是由它引起的吧,真是可恶~~~, 方法好象也比较简单,就是把事件绑定到dom内一个100%宽度的div上面去.
使用Mootools的代码如下:
先在页面上添加一个 div , 设置 style :width:100%;height:100%;position:absolute;z-index:-999;
dom加载后:
![ContractedBlock.gif](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![ExpandedBlockStart.gif](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
//
IE6 & IE7
if (Browser.Engine.trident && (Browser.Engine.version == 4 || Browser.Engine.version == 5 )){
var fix_ie = $( ' fix-ie-resize ' );
if ( ! fix_ie){
alert( ' fix_ie_resize_error ' );
} else {
fix_ie.onresize = function (){
if (onresizeTimeout) {
clearTimeout(onresizeTimeout)
}
onresizeTimeout = setTimeout( function () {
// do something
},
200 );
}
}
} else {
window.onresize = function () {
if (onresizeTimeout) {
clearTimeout(onresizeTimeout)
}
onresizeTimeout = setTimeout( function () {
// do something
},
200 )
};
}
if (Browser.Engine.trident && (Browser.Engine.version == 4 || Browser.Engine.version == 5 )){
var fix_ie = $( ' fix-ie-resize ' );
if ( ! fix_ie){
alert( ' fix_ie_resize_error ' );
} else {
fix_ie.onresize = function (){
if (onresizeTimeout) {
clearTimeout(onresizeTimeout)
}
onresizeTimeout = setTimeout( function () {
// do something
},
200 );
}
}
} else {
window.onresize = function () {
if (onresizeTimeout) {
clearTimeout(onresizeTimeout)
}
onresizeTimeout = setTimeout( function () {
// do something
},
200 )
};
}