<ul>
                    <li><a href="http://news.qq.com/" target="_blank" name="xinwen" title="腾讯新闻">
                        <img class="scrollLoading" data-url="images/col_1.png" src="data:images/loading.gif" width="108"
                            height="86" border="0" />
                    </a>&nbsp; </li>
                    <li><a href="http://news.163.com/" target="_blank" name="xinwen" title="网易新闻">
                        <img class="scrollLoading" data-url="images/col_2.png" src="data:images/loading.gif" width="108"
                            height="86" border="0" /></a> </li>
                    <li><a href="http://www.people.com.cn/" target="_blank" name="xinwen" title="人民网">
                        <img class="scrollLoading" data-url="images/col_3.png" src="data:images/loading.gif" width="108"
                            height="86" border="0" /></a> </li>
                    <li><a href="http://www.chinabyte.com/" target="_blank" name="xinwen" title="比特网">
                        <img class="scrollLoading" data-url="images/col_4.png" src="data:images/loading.gif" width="108"
                            height="86" border="0" /></a> </li>
                    <li><a href="http://www.cntv.cn/" target="_blank" name="xinwen" title="央视网">
                        <img class="scrollLoading" data-url="images/col_5.png" src="data:images/loading.gif" width="108"
                            height="86" border="0" /></a> </li>
</ul> js调用  <script type="text/javascript">
        $(function () {
            $(".scrollLoading").scrollLoading();
        });
    </script>说明:1.需要引入jq 2.引用 <script src="js/jquery.scrollLoading.js" type="text/javascript"></script>3.src为图片加载时候的lodging的图片 ,data-url中的路径才是真正的图片路径!,具体原来请百度! 效果图:pasting

图片延迟加载scrollLoading.js应用的更多相关文章

  1. 两种图片延迟加载的方法总结jquery.scrollLoading.js与jquery.lazyload.js

    估计网上能查到的最多的两种图片延迟加载方法就是jquery.scrollLoading.js与jquery.lazyload.js了,其中jquery.lazyload.js的调用方法因为有网友爆出的 ...

  2. 两种图片延迟加载的方法总结jquery.scrollLoading.js与jquery.lazyload.js---转载

    jquery.scrollLoading方法 html <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml& ...

  3. 延迟加载外部js文件,延迟加载图片(jquery.lazyload.js和echo,js)

    js里一说到延迟加载,大都离不开两种情形,即外部Js文件的延迟加载,以及网页图片的延迟加载: 1.首先简单说一下js文件的3种延迟加载方式: (1)<script type="text ...

  4. js图片延迟加载

    什么是图片延迟加载? 也叫懒加载. 当页面有多屏的时候,页面中的图片比较多. 那么,在页面载入完毕的时候,并不会把所有的图片都加载进来. 而是当用户拖动滚动条的时候,图片要进入用户的视野了,才开始加载 ...

  5. 前端优化之图片延迟加载(lazyload.js)

    要想缩短首屏加载时间,思路一般是减少http请求次数和降低每次的请求量.本文中使用现成的lazyload.js插件,文末会放出下载地址. lazyload.js可以实现图片分批次加载,不是一次性加载完 ...

  6. Echo.js – 简单易用的 JavaScript 图片延迟加载插件

    Echo.js 是一个独立的延迟加载图片的 JavaScript 插件.Echo.js 不依赖第三方库,压缩后不到1KB大小. 延迟加载是提高网页首屏显示速度的一种很有效的方法,当图片元素进入窗口可视 ...

  7. JS实现移动端图片延迟加载

    图片延迟加载常见的有,jquery.lazyload.js,原生JS实现的echo.js.但是都是必须给图片设置宽高. 因为项目是移动端,而且无法在加载前知道图片的宽高,所以,只好自己写了一个. 既然 ...

  8. JS图片延迟加载分析及简单的demo

    JS图片延迟加载 图片延迟加载也称 "懒加载",通常应用于图片比较多的网页,比如 "美丽说首页","蘑菇街"等一些导购网站上用的比较多,或者 ...

  9. jquery.lazyload.js图片延迟加载

    转:http://www.jb51.net/article/50273.htm 这篇文章主要介绍了Jquery图片延迟加载插件jquery.lazyload.js的使用方法,需要的朋友可以参考下   ...

随机推荐

  1. libeXosip2(3) -- SIP messages and call control API

    SIP messages and call control API The SIP messages and call control API. More... Modules eXosip2 INV ...

  2. Go语言中的管道(Channel)总结

    管道(Channel)是Go语言中比较重要的部分,经常在Go中的并发中使用.今天尝试对Go语言的管道来做以下总结.总结的形式采用问答式的方法,让答案更有目的性. Q1.管道是什么? 管道是Go语言在语 ...

  3. [HEOI 2013 day2] SAO (树形动态规划)

    题目大意 给一棵N个节点的有向树(N <= 1000),求其拓扑序列个数. 思路 我们将任意一个点作为根,用dp[i][j]表示以节点i为根的子树满足节点i在第j个位置上的拓扑序列的个数.在求节 ...

  4. python倒计时

    #coding=utf-8 #!/usr/bin/env python import datetime,time i=3 while i==3: spring=datetime.datetime(20 ...

  5. JavaScript运算符有哪些

    JavaScript中的运算符有很多,主要分为算术运算符,等同全同运算符,比较运算符,字符串运算符,逻辑运算符,赋值运算符等.这些运算符都有一些属于自己的运算规则,下面就为大家介绍一下JavaScri ...

  6. 【剑指offer】左旋转字符串

    转载请注明出处:http://blog.csdn.net/ns_code/article/details/27366485 题目描写叙述: 汇编语言中有一种移位指令叫做循环左移(ROL),如今有个简单 ...

  7. 浅谈GitLab与Git

    前言:先解释下关于库的认识. Workspace:工作区 Index / Stage:暂存区 Repository:仓库区(或本地仓库) Remote:远程仓库 一.新增项目(远程仓库) 在GitLa ...

  8. JavaScript 学习之第一篇JavaScript的数据类型(2016/8/29 晚 23:12)

    1. JavaScript的数据类型 JavaScript 里面有6中数据类型 Boolean String Number Undefined Null Object object(对象)类型包含了数 ...

  9. Microsoft Visual Studio 产品密钥

    Microsoft Visual Studio 2010 产品密钥:YCFHQ-9DWCY-DKV88-T2TMH-G7BHP Microsoft Visual Studio 2013 产品密钥:BW ...

  10. 如何安装windows7系统

      在XP时代,光驱对于我们而言仅仅是装系统用,不过在Win7发布之后,可以用U盘直接安装,省时省力. 首先在互联网下载UltraISO光盘映像文件制作/编辑/格式转换工具,(当然还有其它如WinIS ...