基于jquery的图片懒加载js


Posted in Javascript onJune 30, 2010

以下是实现代码(基于jquery):

function lazyload(option){ 
var settings={ 
defObj:null, 
defHeight:0 
}; 
settings=$.extend(settings,option||{}); 
var defHeight=settings.defHeight,defObj=(typeof settings.defObj=="object")?settings.defObj.find("img"):$(settings.defObj).find("img"); 
var pageTop=function(){ 
return document.documentElement.clientHeight+Math.max(document.documentElement.scrollTop,document.body.scrollTop)-settings.defHeight; 
}; 
var imgLoad=function(){ 
defObj.each(function(){ 
if ($(this).offset().top<=pageTop()){ 
var src2=$(this).attr("src2"); 
if (src2){ 
$(this).attr("src",src2).removeAttr("src2"); 
} 
} 
}); 
}; 
imgLoad(); // 绑定滚动事件 
$(window).bind("scroll",function(){ 
imgLoad(); 
}); 
} 
lazyload({ 
defObj:"#plist" 
})
Javascript 相关文章推荐
JQUERY复选框CHECKBOX全选,取消全选
Aug 30 Javascript
统计出现最多的字符次数的js代码
Dec 03 Javascript
jQuery的缓存机制浅析
Jun 07 Javascript
javascript中AJAX用法实例分析
Jan 30 Javascript
js验证身份证号有效性并提示对应信息
Oct 19 Javascript
asp.net+jquery.form实现图片异步上传的方法(附jquery.form.js下载)
May 05 Javascript
前端分页功能的实现以及原理(jQuery)
Jan 22 Javascript
详解angularJs指令的3种绑定策略
Apr 13 Javascript
javascript checkbox/radio onchange不能兼容ie8处理办法
Jun 13 Javascript
从setTimeout看js函数执行过程
Dec 19 Javascript
100行代码实现一个vue分页组功能
Nov 06 Javascript
node.js文件操作系统实例详解
Nov 05 Javascript
CSS和Javascript简单复习资料
Jun 29 #Javascript
javascript与CSS复习(三)
Jun 29 #Javascript
javascript与CSS复习(二)
Jun 29 #Javascript
javascript与CSS复习(《精通javascript》)
Jun 29 #Javascript
通过javascript的匿名函数来分析几段简单有趣的代码
Jun 29 #Javascript
JavaScript 联动的无限级封装类,数据采用非Ajax方式,随意添加联动
Jun 29 #Javascript
Whatever:hover 无需javascript让IE支持丰富伪类
Jun 29 #Javascript
You might like
截获网站title标签之家内容的例子
2006/10/09 PHP
Codeigniter注册登录代码示例
2014/06/12 PHP
php实现倒计时效果
2015/12/19 PHP
PHP编写简单的App接口
2016/08/28 PHP
如何通过Apache在本地配置多个虚拟主机
2020/07/29 PHP
javascript获取隐藏dom的宽高 具体实现
2013/07/14 Javascript
window.showModalDialog()返回值的学习心得总结
2014/01/07 Javascript
JavaScript删除数组元素的方法
2015/03/20 Javascript
jquery简单的弹出层浮动层代码
2015/04/27 Javascript
原生JS实现仿淘宝网左侧商品分类菜单效果代码
2015/09/10 Javascript
bootstrap布局中input输入框右侧图标点击功能
2016/05/16 Javascript
JavaScript模仿Pinterest实现图片预加载功能
2016/10/25 Javascript
nodeJS微信分享
2017/12/20 NodeJs
vue2.0 父组件给子组件传递数据的方法
2018/01/15 Javascript
vue axios数据请求及vue中使用axios的方法
2018/09/10 Javascript
解决layui动态加载复选框无法选中的问题
2019/09/20 Javascript
vue点击Dashboard不同内容 跳转到同一表格的实例
2020/11/13 Javascript
Python的collections模块中的OrderedDict有序字典
2016/07/07 Python
Python做文本按行去重的实现方法
2016/10/19 Python
Python探索之ModelForm代码详解
2017/10/26 Python
python 实现12bit灰度图像映射到8bit显示的方法
2019/07/08 Python
python中pygame安装过程(超级详细)
2019/08/04 Python
Python+Selenium+phantomjs实现网页模拟登录和截图功能(windows环境)
2019/12/11 Python
Python内置类型性能分析过程实例
2020/01/29 Python
使用Python对Dicom文件进行读取与写入的实现
2020/04/20 Python
英国、欧洲和全球租车服务:Avis英国
2016/08/29 全球购物
英国领先的NHS批准的在线药店:Pharmacy2U
2017/01/06 全球购物
大学生标准推荐信范文
2013/11/25 职场文书
导游实习生自荐书
2014/01/28 职场文书
2014年安全生产大检查方案
2014/05/13 职场文书
就业协议书样本
2014/08/20 职场文书
社区党员公开承诺书
2014/08/30 职场文书
2014年干部培训工作总结
2014/12/17 职场文书
2016年公务员六五普法心得体会
2016/01/21 职场文书
幼儿园教学反思范文
2016/03/02 职场文书
八年级作文之友谊
2019/12/02 职场文书