<!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的更多相关文章

  1. 图片懒加载jquery lazyload

    <script type="text/javascript" src="jquery-1.11.3.min.js"></script>& ...

  2. 图片懒加载插件lazyload使用方法

    图片懒加载插件lazyload使用方法 一.如何使用: Lazy Load 依赖于 jQuery.引入文件 <script type="text/javascript" sr ...

  3. Vue图片懒加载之lazyload插件使用

    当内容没有加载完的时候,用户体验不是很好,这时候,可以使用lazyload这个插件,提升用户体验,使用方法特别简单易用 一. vue lazyload插件: 插件地址:https://github.c ...

  4. VUE图片懒加载-vue lazyload插件的简单上手使用（优化版本）

    在用VUE做项目开发的过程中,首页用到了懒加载的方法,查找了一些方法,觉得官网写得太复杂,有一篇博客不错(https://www.cnblogs.com/xyyt/p/7650539.html),但是 ...

  5. 带加载进度的Web图片懒加载组件Lazyload

    在Web项目中,大量的图片应用会导致页面加载时间过长,浪费不必要的带宽成本,还会影响用户浏览体验. Lazyload 是一个文件大小仅4kb的图片懒加载组件(不依赖其它第三方库),组件会根据用户当前浏 ...

  6. jquery懒加载jquery.lazyload.js

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

  7. VUE图片懒加载-vue lazyload插件的简单使用

    序:vue项目时候,我们要对图片进行懒加载处理,这个开发项目中就不需要自己去写了,因为比较方便使用vue lazyload进行处理,高效率开发 一. vue lazyload插件: 插件地址:http ...

  8. 图片懒加载插件lazyload.js详解

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  9. 图片懒加载之lazyload.js插件使用

    简介 lazyload.js用于长页面图片的延迟加载,视口外的图片会在窗口滚动到它的位置时再进行加载,这是与预加载相反的. 使用 lazyload依赖与jquery.所以先引入jquery和lazyl ...

随机推荐

  1. Disruptor之粗糙认识

    一 概述 1.Disruptor Disruptor是一个高性能的异步处理框架,一个“生产者-消费者”模型. 2.RingBuffer RingBuffer是一种环形数据结构,包含一个指向下一个槽点的 ...

  2. drupal 学习思路

    我之前没有学习过框架,用过一个简单的cms.php工作经验有大半年.独立项目经验为0.5.目前在用drupal,用了有三个月,主要是用drupal写app的后台管理和api接口.公司在drupal的基 ...

  3. JSP 之 8种HTTP的请求方式 之 页面组成等

    HTTP请求的方法: HTTP/1.1协议中共定义了八种方法(有时也叫“动作”),来表明Request-URL指定的资源不同的操作方式   1.OPTIONS 返回服务器针对特定资源所支持的HTTP请 ...

  4. git取消本地commit

    如果不小心commit了一个不需要commit的文件,可以对其进行撤销. 先使用git log 查看 commit日志 commit 422bc088a7d6c5429f1d0760d008d86c5 ...

  5. javascript实现数据结构：线索二叉树

    遍历二叉树是按一定的规则将树中的结点排列成一个线性序列,即是对非线性结构的线性化操作.如何找到遍历过程中动态得到的每个结点的直接前驱和直接后继(第一个和最后一个除外)?如何保存这些信息? 设一棵二叉树 ...

  6. wamp的www目录更改为指定目录

    wamp的www目录更改为指定目录内容简介:主要过程: (1)修改httpd.conf文件 (2)修改新的www目录下的index.php文件 (3)修改manage.ini的278行和manage. ...

  7. thinkphp5设置403 404等http状态页面

    在thinkphp5中如何抛出异常状态码(比如401,403,404等),因为这些能极大的给用户以良好的体验. 因为在上线阶段,任何的系统错误信息都不能让浏览用户给看到,比如404(Not Found ...

  8. x86 分页机制——虚拟地址到物理地址寻址

    x86下的分页机制有一个特点:PAE模式 PAE模式 物理地址扩展,是基于x86 的服务器的一种功能,它使运行 Windows Server 2003, Enterprise Edition 和 Wi ...

  9. KMP算法的工作流程介绍

    最近又想起了KMP算法,原来一直没搞明白工作原理,现在总算是开点窍了,推荐大家看这篇文章,写的很简单易懂 推荐理由:简单明了,是我看过介绍KMP算法流程的所有文章中,最易懂的一篇(这篇文章仅仅是介绍了 ...

  10. Git warning push.default is unset

    warning: push.default is unset; its implicit value is changing in Git 2.0 from 'matching' to 'simple ...