传送门:官网地址jQuery Lazy Load v1.7.2下载Github

使用方法:

1.引用js文件

<script src="jquery.js"></script>
<script src="jquery.lazyload.js"></script>

2.修改HTML代码中需要修改的IMG标签

<!--
将真实图片地址写在 data-original 属性中,而 src 属性中的图片换成占位符的图片(例如 1x1 像素的灰色图片或者 loading 的 gif 图片)
添加 class="lazy" 用于区别哪些图片需要延时加载,当然你也可以换成别的关键词,修改的同时记得修改调用时的 jQuery 选择器
添加 width 和 height 属性有助于在图片未加载时占满所需要的空间
-->
<img class="lazy" src="grey.gif" data-original="example.jpg" width="640" heigh="480">

3.调用Lazy Load

$('img.lazy').lazyload();

jQuery Lazy Load图片懒加载的更多相关文章

  1. 用jquery写的图片懒加载

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  2. js可视区域图片懒加载

    可视区域图片懒加载 实现原理,页面滚动时获取需要懒加载的图片,判断此图片是否在可视区域内,是则设置图片data-src地址为src地址,加载图片. html下载地址 <!DOCTYPE html ...

  3. jQuery图片懒加载插件jquery.lazyload.js使用实例注意事项说明

    jQuery图片懒加载插件jquery.lazyload.js使用实例注意事项说明 jquery.lazyload.js是一个用JavaScript编写的jQuery插件.它可以延迟加载长页面中的图片 ...

  4. jquery 图片懒加载

      jquery 图片懒加载 CreationTime--2018年7月1日14点45分 Author:Marydon 1.源码展示 (function(a){a.fn.lazyload=functi ...

  5. 插件:★★★ !!!图片懒加载 lazyload.js 、 jquery.scrollLoading.js

    插件:图片懒加载 jquery.lazyload.js 2016-3-31 插件说明:http://www.w3cways.com/1765.html (小插件,好用) 下载地址: https://r ...

  6. jQuery的图片懒加载

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

  7. jQuery插件图片懒加载lazyload

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

  8. jquery实现简单瀑布流布局(续):图片懒加载

    # jquery实现简单瀑布流布局(续):图片懒加载 这篇文章是jquery实现简单瀑布流布局思想的小小扩展.代码基于前作的代码继续完善. 图片懒加载就是符合某些条件时才触发图片的加载.最常见的具体表 ...

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

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

随机推荐

  1. 部署微软Nano Server的好处是什么?

    虚拟化对数据中心效率和硬件利用率产生了戏剧性的影响,但是接下来有关系统整合的主要责任落 在了操作系统的重量上.虚拟机通常运行企业级操作系统,比如Windows Server,但是Windows Ser ...

  2. 《Cracking the Coding Interview》——第17章:普通题——题目4

    2014-04-28 22:32 题目:不用if语句或者比较运算符的情况下,实现max函数,返回两个数中更大的一个. 解法:每当碰见这种无聊的“不用XXX,给我XXX”型的题目,我都默认处理的是int ...

  3. 《Cracking the Coding Interview》——第12章:测试——题目3

    2014-04-24 23:28 题目:玩象棋游戏,你要设计一个bool型的方法来检测一个棋子能否移动到指定位置. 解法:不同的棋子有不同的移动规则,那么应该采取棋子基类实现接口,各个棋子子类来实现的 ...

  4. DOS程序员手册(八)

    备,就可以从程序中访问驱动程序.可以用句柄功能调用来     打开设备(见列表12.9)         列表12.9           /*example.C               List ...

  5. Pascal 杨辉三角

    用于打印杨辉三角的程序,有多种算法仅提供一种 PRogram yh (input,ouput);var  m,n,c:integer;Begin For m:=0 TO 10 Do   Begin   ...

  6. Python学习记录一

    1.这个在unix类的操作系统才有意义.#!/usr/bin/python是告诉操作系统执行这个脚本的时候,调用/usr/bin下的python解释器:#!/usr/bin/env python这种用 ...

  7. 验证表单的js代码段

     JS常用功能 转载自:http://blog.csdn.net/kalision/article/details/12516103 引用js文件: <script src="js/d ...

  8. DAO设计模式的理解

    为了降低耦合性,提出了DAO封装数据库操作的设计模式. 它可以实现业务逻辑与数据库访问相分离.相对来说,数据库是比较稳定的,其中DAO组件依赖于数据库系统,提供数据库访问的接口. 一般的DAO的封装由 ...

  9. 【Python】- yield 使用浅析

    您可能听说过,带有 yield 的函数在 Python 中被称之为 generator(生成器),何谓 generator ? 我们先抛开 generator,以一个常见的编程题目来展示 yield ...

  10. poj 2253 Frogger (最短路径)

    Frogger Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 22557   Accepted: 7339 Descript ...