jQuery Lazy Load图片懒加载
传送门:官网地址,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图片懒加载的更多相关文章
- 用jquery写的图片懒加载
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
- js可视区域图片懒加载
可视区域图片懒加载 实现原理,页面滚动时获取需要懒加载的图片,判断此图片是否在可视区域内,是则设置图片data-src地址为src地址,加载图片. html下载地址 <!DOCTYPE html ...
- jQuery图片懒加载插件jquery.lazyload.js使用实例注意事项说明
jQuery图片懒加载插件jquery.lazyload.js使用实例注意事项说明 jquery.lazyload.js是一个用JavaScript编写的jQuery插件.它可以延迟加载长页面中的图片 ...
- jquery 图片懒加载
jquery 图片懒加载 CreationTime--2018年7月1日14点45分 Author:Marydon 1.源码展示 (function(a){a.fn.lazyload=functi ...
- 插件:★★★ !!!图片懒加载 lazyload.js 、 jquery.scrollLoading.js
插件:图片懒加载 jquery.lazyload.js 2016-3-31 插件说明:http://www.w3cways.com/1765.html (小插件,好用) 下载地址: https://r ...
- jQuery的图片懒加载
jQuery的图片懒加载 function imgLazyLoad(options) { var settings = { Id: $('img'), threshold: 100, effectsp ...
- jQuery插件图片懒加载lazyload
来自XXX的前言: 什么是ImageLazyLoad技术 在页面上图片比较多的时候,打开一张页面必然引起与服务器大数据量的 交互.尤其是对于高清晰的图片,占的几M的空间.ImageLazyLoad技术 ...
- jquery实现简单瀑布流布局(续):图片懒加载
# jquery实现简单瀑布流布局(续):图片懒加载 这篇文章是jquery实现简单瀑布流布局思想的小小扩展.代码基于前作的代码继续完善. 图片懒加载就是符合某些条件时才触发图片的加载.最常见的具体表 ...
- jQuery.imgLazyLoad图片懒加载组件
一.前言 当一个页面中请求的图片过多,而且图片太大,页面访问的速度是非常慢的,对用户的体验非常不友好:使用图片懒加载,可以减轻服务器的压力,增加页面的访问量,这里主要是总结一下我自己写的图片懒加载组件 ...
随机推荐
- videomon 环境搭建
1.安装ACE-5.8.0.tar.bz2 tar -zxvf ACE-.tar.bz2 cd ACE_wrappers/mkdir buildcd build../configuremake &am ...
- ADMX Migrator
实用工具特别推荐ADMX MigratorLance Whitney 下载这篇文章的代码: ADMX Migrator (2765KB) 对于那些 使用组策略的人而言,他们自然非常熟悉如何使用管理模板 ...
- 是时候用Coffeescript了
CoffeeScirpt是什么? CoffeeScript是一门小巧的语言脚本语言,会编译为JavaScript,并且CoffeeScript产生的JavaScript是可以通过JavaScript ...
- DataGridView重查后,返回原来所在行
首先记录选中行 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 //查询前记录选中行 int _currentRow = 0; //int _cu ...
- sql 表数据转移另一张表
if not exists(select * from syscolumns where id=object_id('REMOTEDETECTION_2018')) begin SELECT * I ...
- linux服务器基本安全配置手册
转:忘了在哪转的,直接复制到笔记里了,贴出来分享 假如你想要搭建一个Linux服务器,并且希望可以长期维护的话,就需要考虑安全性能与速度等众多因素.一份正确的linux基本安全配置手册就显得格外重要. ...
- HDU 4109 Instrction Arrangement(DAG上的最长路)
把点编号改成1-N,加一点0,从0点到之前任意入度为0的点之间连一条边权为0的边,求0点到所有点的最长路. SPFA模板留底用 #include <cstdio> #include < ...
- Android记事本10
昨天: 从Activity中返回数据. 请求码和结果码的作用. 今天: Activity的启动模式. 遇到的问题: 无.
- 七、vue计算属性
细节流程图 初始化 计算属性的初始化是发生在 Vue 实例初始化阶段的 initState 函数中,执行了 if (opts.computed) initComputed(vm, opts.compu ...
- freebsd网卡驱动程序详解
freebsd网卡驱动程序详解 来源 https://blog.csdn.net/h_cszc/article/details/7776116 /* 注释:xie_minix */ /*此处为BSD申 ...