图片延迟加载scrollLoading.js应用
<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> </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应用的更多相关文章
- 两种图片延迟加载的方法总结jquery.scrollLoading.js与jquery.lazyload.js
估计网上能查到的最多的两种图片延迟加载方法就是jquery.scrollLoading.js与jquery.lazyload.js了,其中jquery.lazyload.js的调用方法因为有网友爆出的 ...
- 两种图片延迟加载的方法总结jquery.scrollLoading.js与jquery.lazyload.js---转载
jquery.scrollLoading方法 html <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml& ...
- 延迟加载外部js文件,延迟加载图片(jquery.lazyload.js和echo,js)
js里一说到延迟加载,大都离不开两种情形,即外部Js文件的延迟加载,以及网页图片的延迟加载: 1.首先简单说一下js文件的3种延迟加载方式: (1)<script type="text ...
- js图片延迟加载
什么是图片延迟加载? 也叫懒加载. 当页面有多屏的时候,页面中的图片比较多. 那么,在页面载入完毕的时候,并不会把所有的图片都加载进来. 而是当用户拖动滚动条的时候,图片要进入用户的视野了,才开始加载 ...
- 前端优化之图片延迟加载(lazyload.js)
要想缩短首屏加载时间,思路一般是减少http请求次数和降低每次的请求量.本文中使用现成的lazyload.js插件,文末会放出下载地址. lazyload.js可以实现图片分批次加载,不是一次性加载完 ...
- Echo.js – 简单易用的 JavaScript 图片延迟加载插件
Echo.js 是一个独立的延迟加载图片的 JavaScript 插件.Echo.js 不依赖第三方库,压缩后不到1KB大小. 延迟加载是提高网页首屏显示速度的一种很有效的方法,当图片元素进入窗口可视 ...
- JS实现移动端图片延迟加载
图片延迟加载常见的有,jquery.lazyload.js,原生JS实现的echo.js.但是都是必须给图片设置宽高. 因为项目是移动端,而且无法在加载前知道图片的宽高,所以,只好自己写了一个. 既然 ...
- JS图片延迟加载分析及简单的demo
JS图片延迟加载 图片延迟加载也称 "懒加载",通常应用于图片比较多的网页,比如 "美丽说首页","蘑菇街"等一些导购网站上用的比较多,或者 ...
- jquery.lazyload.js图片延迟加载
转:http://www.jb51.net/article/50273.htm 这篇文章主要介绍了Jquery图片延迟加载插件jquery.lazyload.js的使用方法,需要的朋友可以参考下 ...
随机推荐
- Temporary failure in name resolution
公司搬家,在一台测试机上执行git clone,出现错误 ssh: Could not resolve hostname **: Temporary failure in name resolutio ...
- hdu1023:卡特兰数
火车进站问题 卡特兰数引入的例子. 卡特兰数递推公式:h(n)=h(n-1)*(4*n-2)/(n+1) 通项公式:h(n)=c(2n,n)/(n+1)... 这题需要高精度,刚好学了一下java.. ...
- pythonchallenge学到的python内置函数整理
第0关: 计算x的n次方: x**n 第一关: maketrans(from,to):建立一个翻译规则,将from翻译成to的翻译规则,因为要从from翻译成to,所以俩个参数的长度必须一致 tran ...
- c++命名空间瀑布
一般情况,函数放在命名空间外,命名空间内部放置声明 #include<iostream> using namespace std; //一般情况,函数放在命名空间外,命名空间内部放置声明 ...
- python linecache标准库基础学习
#python标准库基础之:linecacge:高效读取文本文件#说明与作用"""可以从文件或者导入python模块获取文件,维护一个结果缓存,从而可以更高效地从相同文件 ...
- Android下Affinities和Task
源文链接:http://appmem.com/archives/405 本文参考了官方Dev Guide文档,简单介绍Android下的affinities和任务(task). 1.Activity和 ...
- java基础之集合
集合的定义,集合的应用,集合的分类,集合的遍历,集合的特性
- java.sql.SQLException: ORA-00911: 无效字符 解决方案
在使用java执行sql时,抛出的这样一个Oracle异常,最后发现是sql语句末尾有一个分号导致,例如:sql="select * from tl_demo;" .删除" ...
- 如何禁用不需要的HTTP方法
IIS7.0默认开启了不安全的OPTIONS和TRACE方法,建议关闭这两个方法. 以下环境为windows server 2008.IIS7.0 方法(1):web.config 在<conf ...
- linux服务器伪分布模式安装hadoop-1.1.2
1:环境准备 1台linux服务器, hadoop安装包(apache官方网下载) jdk1.6+ 2:安装jdk ,配置好环境变量(etc/profile),java -version 测 ...