标签:
$("#img").load(function(){...});
这是jquery提供的一个方法,但是在IE中会有BUG,IE8不支持,IE9以上刷新后也不会执行,只有强制刷新才执行,所以不能使用这个jquery提供的方法
应该使用:
只能通过JS的onload来触发事件,当然触发的事件代码中可以使用jquery代码(但是,IE8也有BUG,普通刷新的时候图片从缓存读入,读入速度比代码更快,导致onload代码不能运行,解决方法看继续往下看)
document.getElementById(‘topBanner‘).onload = function() { var top = $(‘#nav‘).offset().top; $(window).scroll(function() { var scroll = $(document).scrollTop(); var pos = scroll - top; if (scroll > top) { $(‘#nav‘).css(‘top‘, pos + 12 + ‘px‘); } else { $(‘#nav‘).css(‘top‘, ‘12px‘); }; });
彻底兼容IE8:
//首先声明一个空的Image对象 var img = new Image(); //通过img对象调用onload事件;定义事件处理函数,并不执行(类似于在标签内定义事件) img.onload = function() { var top = $(‘#nav‘).offset().top; $(window).scroll(function() { var scroll = $(document).scrollTop(); var pos = scroll - top; if (scroll > top) { $(‘#nav‘).css(‘top‘, pos + 12 + ‘px‘); } else { $(‘#nav‘).css(‘top‘, ‘12px‘); }; }); } //然后再为img对象赋值src,让这个img对象有具体的指向,才开始执行onload事件。这样就能兼容IE8了 img.src = document.getElementById(‘topBanner‘).src; $(window).resize(function() { top = $(‘#nav‘).offset().top; $(window).scroll(function() { var scroll = $(document).scrollTop(); var pos = scroll - top; if (scroll > top) { $(‘#nav‘).css(‘top‘, pos + 12 + ‘px‘); } else { $(‘#nav‘).css(‘top‘, ‘12px‘); }; }); }); }
标签:
原文地址:http://www.cnblogs.com/3body/p/5416844.html