$("#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. Python mysql-数据库基础知识

    2017-09-05 19:10:55 一.数据库定义 从本质上讲,数据库就是信息的集合,它可以存在很长时间,往往是很多年.一般来讲,"数据库"这个词指的是有数据库管理系统管理的数 ...

  2. 周立功USBCAN-II 上位机开发(MFC)

    使用的USB转CAN的设备是周立功的USBCAN-II,在购买的时候,会有上位机二次开发的库文件.例程和API文档等材料,可以参考. 1.库函数的调用 首先,把库函数文件都放在工作目录下.库函数文件总 ...

  3. English trip -- Iris老师整理的一般时态

    一般疑问句: 用Yes/No 就能回答的问句. a.g Are you an office worker? 问句 <                                        ...

  4. Sasha and Interesting Fact from Graph Theory CodeForces - 1109D (图论,计数,Caylay定理)

    大意: 求a->b最短路长度为m的n节点树的个数, 边权全部不超过m 枚举$a$与$b$之间的边数, 再由拓展$Caylay$定理分配其余结点 拓展$Caylay$定理 $n$个有标号节点生成k ...

  5. php fpm深度解析

    摘自:https://www.cnblogs.com/wanghetao/p/3934350.html 当我们在谈到cgi的时候,我们在讨论什么 最早的Web服务器简单地响应浏览器发来的HTTP请求, ...

  6. Oracle12c中性能优化增强新特性之数据库智能闪存

    智能闪存功能最初在XD中引入.从Oracle11.2.0.2开始,除了用于XD存储,还可用于任何闪盘.Oracle12c中,不需卷管理器就可以使用闪盘. 1.  简介 智能闪存在solaris和lin ...

  7. Netty高性能编程备忘录(下)

    估计很快就要被拍砖然后修改,因此转载请保持原文链接,否则视为侵权... http://calvin1978.blogcn.com/articles/netty-performance.html 前文再 ...

  8. MVC 表单提交

    用户提交表单 写法一(推荐) 一,不带参数 <body> <!--一下写法生成:<form action="/Home/Index" method=&quo ...

  9. prayer OJ M

    这一题是一把辛酸泪啊...一个半小时ac的... 首先,考虑到如果要一条路径最小,那么肯定是没有值大于等于3的 显然如果有一个大于等于3的,那么这个数把路径分成两份,一份有k个,一个n-k-1个 那么 ...

  10. L1-040 最佳情侣身高差

    专家通过多组情侣研究数据发现,最佳的情侣身高差遵循着一个公式:(女方的身高)×1.09 =(男方的身高).如果符合,你俩的身高差不管是牵手.拥抱.接吻,都是最和谐的差度. 下面就请你写个程序,为任意一 ...