传送门:官网地址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. 怎么设置才能让外网ip可以访问mysql数据库[转]

    转自: http://www.hongyanliren.com/89.html 使用mysql中,很多人都会遇到这样的问题:在vps服务器或者云服务器上安装了mysql后,使用其他工具在外网ip之下根 ...

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

    2014-04-28 22:05 题目:写个程序判断三连棋哪一方赢了. 解法:三个相同的棋子连成一条横线,竖线或者对角线就判断为赢了. 代码: // 17.2 Write an algorithm t ...

  3. ptmalloc,tcmalloc和jemalloc内存分配策略研究 ? I'm OWen..

    转摘于http://www.360doc.com/content/13/0915/09/8363527_314549949.shtml 最近看了glibc的ptmaoolc,Goolge的tcmall ...

  4. Python 字符串格式化输出方式

    字符串格式化有两种方式:百分号方式.format方式. 其中,百分号方式比较老,而format方式是比较先进的,企图替代古老的方式,目前两者共存. 1.百分号方式 格式:%[(name)][flags ...

  5. Heat 如何来实现和支持编排

    编排 编排,顾名思义,就是按照一定的目的依次排列.在 IT 的世界里头,一个完整的编排一般包括设置服务器上机器.安装 CPU.内存.硬盘.通电.插入网络接口.安装操作系统.配置操作系统.安装中间件.配 ...

  6. leetcode 214. 最短回文串 解题报告

    给定一个字符串 s,你可以通过在字符串前面添加字符将其转换为回文串.找到并返回可以用这种方式转换的最短回文串. 示例 1: 输入: "aacecaaa" 输出: "aaa ...

  7. 聊聊、Spring ServletContainerInitializer

    我们平时用 Java 注解很多,例如 @Configuration.@Component.@Service,我们习惯于通过 XML 方式来实现 Web,而用 Java 注解方式来实现 Web 却很少. ...

  8. realloc在aarch64_be-gcc的奇怪表现

    最近遇到一个使用aarch64_be-gcc编译的ssh服务器出现不能通过ssh1协议使用密钥+passphrase不能正常登陆的问题. (⊙o⊙)…不要奇怪为啥还在用SSH1,我也在奇怪.. 一顿捣 ...

  9. 【linxu】部署docker容器虚拟化平台

    实验所涉内容 Docker 概述 部署 docker 容器虚拟化平台 docker 平台基本使用方法 创建docker镜像和发布镜像方法 Container 容器端口映射 一 Docker 概述 Do ...

  10. 201621123033 《Java程序设计》第3周学习总结

    第三周作业 1. 本周学习总结 初学面向对象,会学习到很多碎片化的概念与知识.尝试学会使用思维导图将这些碎片化的概念.知识点组织起来.请使用工具画出本周学习到的知识点及知识点之间的联系.步骤如下: 1 ...