QQ 1640076782

2014年11月28日

jQuery实现图片延迟加载

Filed under: 英语网站设计 — 标签：, — limeng @ 7:14 上午

对于专门的图片网站或是素材网站，一个页面可能会有很多图片，这个当用户打开网站时，图片会加载的十分慢，用户体验也会很差。jQuery实现图片延迟加载原理就是先加载一屏内的图片，当拉旁边的滚动条时，再依次加载下面的图片，这样就避免了用户需要等所有图片加载完，再浏览。

jQuery实现图片延迟加载方法一

<script type="text/javascript">
<!--//--><![CDATA[//><!--
var images = new Array()
function preload() {
for (i = 0; i < preload.arguments.length; i++) {
images[i] = new Image()
images[i].src = preload.arguments[i]
}
}
preload(

“images/1.jpg”

“images/2.jpg”

“images/3.jpg”

)
//--><!]]>
</script>
这种方法虽然简单，但是需要有多少图片就写多少次或者是图片名称有规律性递增，太麻烦了，只适用于少量图片的情况。
jQuery实现图片延迟加载方法二
之所以图片会用_lazysrc，其实也是避免了其他不需要预加载的图片，且用正常的src，对谷歌等浏览器会有漏洞，一般不建议。
这个方法适用于图片很多，且图片名称无规律。