码迷,mamicode.com
首页 > Web开发 > 详细

Jquery.ScrollLoading图片延迟加载技术

时间:2014-12-02 06:45:34      阅读:279      评论:0      收藏:0      [点我收藏+]

标签:http   ar   ad   ef   tt   .net   技术   jquery   ht   

关于分屏加载图片,像天猫、京东等电商图片较多页面很长,就采用了延迟加载技术。

目前很流行的做法就是滚动动态加载,显示屏幕之外的图片默认是不加载的,

随着页面的滚动,显示区域图片才被动态加载。

原理其实很简单,默认<img>标签中设置一个特别小的让人看不见的图片作为原始src路径,

再自定义一个属性存放原图片路径,通过绑定滚动事件,检查当前元素是否在浏览器窗口中,

然后替换src路径动态加载图片。

找了几个jquery插件都不太好用,kissy没用明白。

最后发现了一个大神写的jQuery滚动加载插件scrollLoading测试很好用。

再这里分享下~

下载demo。

Jquery.ScrollLoading图片延迟加载技术

标签:http   ar   ad   ef   tt   .net   技术   jquery   ht   

原文地址:http://www.cnblogs.com/han1982/p/4136444.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!