图片懒加载 jquery.lazyload
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Lazy Load Enabled</title>
<!--[if lt IE 9]>
<script src="html5shiv.js"></script>
<![endif]-->
</head>
<body>
<img class="lazy" data-original="img/bmw_m1_hood.jpg" width="765" height="574" alt="BMW M1 Hood">
<img class="lazy" data-original="img/bmw_m1_side.jpg" width="765" height="574" alt="BMW M1 Side">
<img class="lazy" data-original="img/viper_1.jpg" width="765" height="574" alt="Viper 1">
<img class="lazy" data-original="img/viper_corner.jpg" width="765" height="574" alt="Viper Corner">
<img class="lazy" data-original="img/bmw_m3_gt.jpg" width="765" height="574" alt="BMW M3 GT">
<img class="lazy" data-original="img/corvette_pitstop.jpg" width="765" height="574" alt="Corvette Pitstop">
<script src="jquery-1.11.0.min.js"></script>
<script src="jquery.lazyload.js?v=1.9.1"></script>
<script type="text/javascript" charset="utf-8">
$(function() {
$("img.lazy").lazyload({effect: "fadeIn"});
});
</script>
<!--可删除-->
<script src="http://www.jq22.com/js/jq.js"></script>
<!--ecd 可删除-->
</body>
</html>
图片懒加载 jquery.lazyload的更多相关文章
- 图片懒加载jquery lazyload
<script type="text/javascript" src="jquery-1.11.3.min.js"></script>& ...
- 图片懒加载插件lazyload使用方法
图片懒加载插件lazyload使用方法 一.如何使用: Lazy Load 依赖于 jQuery.引入文件 <script type="text/javascript" sr ...
- Vue图片懒加载之lazyload插件使用
当内容没有加载完的时候,用户体验不是很好,这时候,可以使用lazyload这个插件,提升用户体验,使用方法特别简单易用 一. vue lazyload插件: 插件地址:https://github.c ...
- VUE图片懒加载-vue lazyload插件的简单上手使用(优化版本)
在用VUE做项目开发的过程中,首页用到了懒加载的方法,查找了一些方法,觉得官网写得太复杂,有一篇博客不错(https://www.cnblogs.com/xyyt/p/7650539.html),但是 ...
- 带加载进度的Web图片懒加载组件Lazyload
在Web项目中,大量的图片应用会导致页面加载时间过长,浪费不必要的带宽成本,还会影响用户浏览体验. Lazyload 是一个文件大小仅4kb的图片懒加载组件(不依赖其它第三方库),组件会根据用户当前浏 ...
- jquery懒加载jquery.lazyload.js
Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...
- VUE图片懒加载-vue lazyload插件的简单使用
序:vue项目时候,我们要对图片进行懒加载处理,这个开发项目中就不需要自己去写了,因为比较方便使用vue lazyload进行处理,高效率开发 一. vue lazyload插件: 插件地址:http ...
- 图片懒加载插件lazyload.js详解
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 图片懒加载之lazyload.js插件使用
简介 lazyload.js用于长页面图片的延迟加载,视口外的图片会在窗口滚动到它的位置时再进行加载,这是与预加载相反的. 使用 lazyload依赖与jquery.所以先引入jquery和lazyl ...
随机推荐
- Java开发坏境配置
在"系统变量"中设置3项属性,JAVA_HOME,PATH,CLASSPATH(大小写无所谓),若已存在则点击"编辑",不存在则点击"新建" ...
- 有关table布局时tr 属性display:block显示布局错乱
display:block display:block是可以把非块级元素强制转换为块级元素显示,如内嵌元素span,原来不支持设置宽高,宽度是由内容撑开的; display:table-row tab ...
- Stage2--Python的数据类型
说在前面: Stage1-Stage4简单介绍一下Python语法,Stage5开始用python实现一些实际应用,语法的东西到处可以查看到,学习一门程序语言的最终目的是应用,而不是学习语法,语法本事 ...
- 用户选择wordpress程序建站需要知道的一些事情 - 安全、优化速度、配置
WordPress是我们使用最多的CMS程序之一,无论是我们的个人博客,还是企业网站,甚至中小型站点,我们都可以用WP程序部署.我们看到海外网站的时候,大部分都是用的WORDPRESS程序.在我们国人 ...
- SharePoint 2013 - Callout
1. 没有OOTB的方法对Callout进行修改,Callout可以使用在以下范围: Document Library Assert Library Images Library Pages Libr ...
- Windows下COCOS2D-X开发环境配置
1. 下载Android SDK: http://developer.android.com/sdk/index.html ,解压到E:\ADT 目录下 2. 下载NDK: http://develo ...
- Dynamics CRM GBK编码
Dynamics CRM用文本汉字为条件去请求数据时,传过去的竟然是GBK编码⊙_⊙ 下面这段代码解决了我的问题,这是拷贝自网上一位大神的博客: http://qq100002656.blog.163 ...
- 解决Image在canvas以及audio、video在AudioContext下跨域问题
媒体元素嘛,在对应的标签或对象上加上 crossOrigin = 'anonymous' 即可. 例如 Image 在canvas 上绘制时会跨域: <img crossOrigin=" ...
- tampermonkey利用@require调用本地脚本的方法
比如Tampermonkey上的有个用户脚本a,本来的方法是: 1.直接在Tampermonkey上编辑js,适合高手,但是本人不清楚脚本如何同步,况且不熟练js,在Tampermonkey上写太难了 ...
- March 28 2017 Week 13 Tuesday
Never was anything great achieved without danger. 不经历风雨,又怎能见彩虹. After the rain, if there's the sunsh ...