js懒加载图片简介:如何提高网页加载速度?在网页中有许多img标签,这些标签就是图片,其属性src则是指向服务器地址,当浏览器从上往下读取到src标签中的地址时,浏览器就会开启线程,加载这张图片。而并不是等到整张页面都解析完成才加载图片。我们要做的就是,1.不能让浏览器加载到大图片,2.加载用户可视范围内的图片。
懒加载图片工具:使用jquery.lazyload.js的机制
js懒加载图片的目的:1.网页优化,提高网页加载速度
爱特效技术支持:www.
1.使用js懒加载图片的原理介绍
下面是浏览器并发加载的过程图:
我们很轻易得出结论:
2.如何进行js懒加载图片
4.如何使用js懒加载图片
<script src="jquery.js" type="text/javascript"></script> <script src="jquery.lazyload.js" type="text/javascript"></script>
src="img/grey.gif" data-original="img/example.jpg" width="640" height="480">
$("img.lazy").lazyload();
5.使用优点分析
6.使用缺点分析
作者也在尽力开发一个综合的js特效,希望今年能发布吧。
|
|