$("#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');
};
});
});
}

图片加载完毕后执行JS代码的更多相关文章

  1. 在css加载完毕后执行后续代码

    最近在写项目的framework,写个JQueryMessageBox的类,以使用jquery ui中的dialog()来显示消息框,为了使方法方便调用,便加入了自动判断页面是否加入了ui.js和ui ...

  2. 图片加载完后执行js

    <script>            window.onload=function(){                          var liwidth = $('.imgul ...

  3. 页面加载完毕后调用js方法进行布局操控 已实验

    页面加载完毕后调用js方法进行布局操控 已实验 $(function(){ var check1 = $("[id$=SMS]").is(':checked'); var bl=$ ...

  4. 如何实现加载DOM时执行js代码

    有一些功能需求,需要在DOM载入时马上执行一些函数,但又不愿意仅为了这一个需求而引入整个JQuery库,于是就把jQuery的方法提取出来,单独使用了. 大家可以使用windows.onload事件, ...

  5. 两种方法实现在HTML页面加载完毕后运行JS

    JS默认方法: <script type=”text/javascript”> window.onload=function (){ /*代码区域*/ } </script> ...

  6. js判断图片加载完成后获取图片实际宽高

    通常,我们会用jq的.width()/.height()方法获取图片的宽度/高度或者用js的.offsetwidth/.offsetheight方法来获取图片的宽度/高度,但这些方法在我们通过样式设置 ...

  7. js中页面加载完成后执行的几种方法及执行顺序

    在js和jquery使用中,经常使用到页面加载完成后执行某一方法.通过整理,大概是五种方式(其中有的只是书写方式不一样). 1:使用jQuery的$(function){}; 2:使用jquery的$ ...

  8. js 图片加载完后的处理事件

    //图片加载完成后再显示页面 document.getElementById('icon').onload=function(){ document.getElementById('wrap').st ...

  9. jquery循环延迟加载,用于在图片加载完成后再加载js

    <html> <head> <script type="text/javascript" src="http://lib.sinaapp.c ...

随机推荐

  1. Linux 虚拟内存和物理内存的理解

    关于Linux 虚拟内存和物理内存的理解. 首先,让我们看下虚拟内存: 第一层理解 1. 每个进程都有自己独立的4G内存空间,各个进程的内存空间具有类似的结构 2. 一个新进程建立的时候,将会建立起自 ...

  2. GetTitleAndUrl

    Sub GetTitleAndUrl() Dim strText As String Dim i As Long Dim OneA Dim IsContent As Boolean Dim PageI ...

  3. 『Numpy』高级函数_np.nditer()&ufunc运算

    1.np.nditer():numpy迭代器 默认情况下,nditer将视待迭代遍历的数组为只读对象(read-only),为了在遍历数组的同时,实现对数组元素值得修改,必须指定op_flags=[' ...

  4. fzu1901 kmp

    For each prefix with length P of a given string S,if S[i]=S[i+P] for i in [0..SIZE(S)-p-1], then the ...

  5. C/C++中的实参和形参,重点以及盲点,自己以前未知的

    C/C++中的实参和形参   今天突然看到一道关于形参和实参的题,我居然不求甚解.藐视过去在我的脑海里只有一个参数的概念,对于形参和实参的区别还真的不知道,作为学习了几年C++的人来说,真的深深感觉对 ...

  6. WaitForMultipleObjects用法详解

    本文转载于:http://blog.csdn.net/sac761/article/details/52456385 WaitForMultipleObjects是Windows中的一个功能非常强大的 ...

  7. Sql server函数的学习2(游标函数、日期函数、字符串操纵函数)

    一.游标函数与变量 游标可以处理多行数据,在过程循环中一次访问一行.和基于集合的高效操作相比,这个功能对系统资源的消耗更大. 可以用一个函数和两个全局变量来管理游标操作 1.CURSOR_STATUS ...

  8. httpclient httpclient连接回收

    httpclient连接释放 httpClient必须releaseConnection,但不是abort.因为releaseconnection是归还连接到到连接池,而abort是直接抛弃这个连接, ...

  9. learning uboot how to set ddr parameter in qca4531 cpu

    DDR工作频率  在600MHZ. include/configs/board953x.h #define CFG_PLL_FREQ            CFG_PLL_650_600_200 #d ...

  10. css 初始包含块

    continuous media ,paged media 关于continuous media[连续媒体]和paged media[分页媒体] 直白的讲,continuous和paged media ...