function lazyload(option){
var settings={
defObj:null,
defHeight:
};
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"
})

原文地址

基于jquery的图片懒加载js的更多相关文章

  1. 使用jQuery实现图片懒加载原理

    原文:https://www.liaoxuefeng.com/article/00151045553343934ba3bb4ed684623b1bf00488231d88d000 在网页中,常常需要用 ...

  2. jQuery的图片懒加载

    jQuery的图片懒加载 function imgLazyLoad(options) { var settings = { Id: $('img'), threshold: 100, effectsp ...

  3. jQuery插件图片懒加载lazyload

    来自XXX的前言: 什么是ImageLazyLoad技术 在页面上图片比较多的时候,打开一张页面必然引起与服务器大数据量的 交互.尤其是对于高清晰的图片,占的几M的空间.ImageLazyLoad技术 ...

  4. jQuery.imgLazyLoad图片懒加载组件

    一.前言 当一个页面中请求的图片过多,而且图片太大,页面访问的速度是非常慢的,对用户的体验非常不友好:使用图片懒加载,可以减轻服务器的压力,增加页面的访问量,这里主要是总结一下我自己写的图片懒加载组件 ...

  5. 基于javascript实现图片懒加载(亲测有效)

    这篇文章主要介绍了javascript实现图片懒加载的方法及思路,有时我们需要用懒加载,也就是延迟加载图片的方式,来提高网站的亲和力,需要的朋友可以参考下! 一.定义 图片延迟加载也称为懒加载,延迟加 ...

  6. jQuery实现图片懒加载

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. jquery <img> 图片懒加载 和 标签如果没有加载出图片或没有图片,就显示默认的图片

    参考链接:http://www.jq22.com/jquery-info390 或压缩包下载地址:链接:http://pan.baidu.com/s/1hsj8ZWw 密码:4a7s    下面是没有 ...

  8. 基于jQuery的图片异步加载和预加载实例

    如今的网页中有很多图片,比如相册列表,那么如果一次性读取图片将会瞬间加重服务器的负担,所以我们用jQuery来实现图片的异步加载和预加载功能,这样在页面的可视范围内才会加载图片,当拖动页面至可视界面时 ...

  9. [jQuery插件]手写一个图片懒加载实现

    教你做图片懒加载插件 那一年 那一年,我还年轻 刚接手一个ASP.NET MVC 的 web 项目, (C#/jQuery/Bootstrap) 并没有做 web 的经验,没有预留学习时间, (作为项 ...

随机推荐

  1. Delphi之DLL知识学习3---为什么要使用DLL

    使用DLL有若干理由,其中有一些前面提到过的.大体说来,使用动态链接库可以共享代码.系统资源,可以隐藏实现的代码或底层的系统例程.设计自定义控件 一.共享代码.资源和数据 前面已经提到,共享代码是创建 ...

  2. 如何调试SSIS包之跟踪变量赋值

    在SSIS开发工具SQL Server Data Tools中提供了调试功能,可以让我们方便的跟踪参数赋值或者数据流条数.本文主要介绍了如何使用SSDT的调试功能. Part A: Script ta ...

  3. hihoCoder 1391 Countries【预处理+排序+优先队列】2016北京网络赛

    题目:http://hihocoder.com/problemset/problem/1391 题目大意: A和B两个国家互射导弹,每个国家都有一个防御系统,在防御系统开启的时间内可以将到达本国的导弹 ...

  4. 程序员最喜爱的12个Android应用开发框架二(转)

    在上一篇程序员最喜爱的12个Android应用开发框架(一)中,我们为大家介绍了前6个Android应用开发框架,主要包括了 Xamarin.Phonegap.Corona SDK等.接下来,小编将继 ...

  5. Android之Adapter用法总结(转)

    Android之Adapter用法总结 1.概念 Adapter是连接后端数据和前端显示的适配器接口,是数据和UI(View)之间一个重要的纽带.在常见的View(List View,Grid Vie ...

  6. NSFileManager 的基本使用方法

    本方法已有个人总结, int main(int argc, const char * argv[]) { @autoreleasepool { NSString *path=@"/Users ...

  7. 【Debug 报异常】Debug打断点报错

    用DEBUG启动项目,项目中打断点的,然后会报异常 解决方法: 第一步: 项目-->Java编译器-->Classfile Generation 复选框 全部勾选 第二步: 替换当前文件运 ...

  8. XCL-Charts图表库简要教程及常见问题

    这个Andriod图表库项目从开始至现在,热情消耗几近殆尽.还好已基本实现我想做的那些东西.趁还剩下点兴趣,把一些点非常简单的归纳一下. 所支持的图表类型: 基类                   ...

  9. 临时变量不能作为非const类型引用形参的实参

    摘要:     非const 引用形参只能与完全同类型的非const对象关联.      具体含义为:(1)不能用const类型的对象传递给非const引用形参:                  ( ...

  10. 各浏览器抗uaf机制

    今年中旬,微软针对旗下ie浏览器中大量出现的uaf漏洞,对ie浏览器的安全机制进行了一个大幅度的升级,其中主要体现为隔离堆及延迟释放两个机制,顿时又将uaf漏洞的利用向上提升了一个大坎, 但是类似的对 ...