GayHub位置:https://github.com/ApoorvSaxena/lozad.js

导入:

<script type="text/javascript" src="http://www.trancemelody.cn/bigi/js/lozad-v1.4.0.js"></script>

简单使用方式:

In HTML, add an identifier to the element (default selector identified is lozad class):
<img id="all" class="lozad" data-src="http://www.trancemelody.cn/bigi/images/enjoy/enjoy_v01-01_1_1.jpg" />

All you need to do now is just instantiate Lozad as follows:
const observer = lozad(); // lazy loads elements with default selector as '.lozad'
observer.observe();

更新图片简单方式:

$("#all").attr("data-src","http://www.trancemelody.cn/bigi/images/enjoy/enjoy_v01-01_1_2.jpg");
$("#all").attr("data-loaded","false");
observer.observe();

The "data-loaded"="true" attribute is used by lozad to determine if an element has been previously loaded.

Lozad.js 简单使用的更多相关文章

  1. js简单 图片版时钟,带翻转效果

    js简单 图片版时钟,带翻转效果 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...

  2. js简单操作Cookie

    贴一段js简单操作Cookie的代码: //获取指定名称的cookie的值 function getCookie(objName) { var arrStr = document.cookie.spl ...

  3. js简单弹出层、遮罩层

    <html> <head> <title>js简单弹出层</title> <style> /*阴影边框效果*/ .box-shadow-1 ...

  4. Tourist.js – 简单灵活的操作指南和导航插件

    Tourist.js 是一个基于 Backbone 和 jQuery 开发的轻量库,帮助你在应用程序创建简单易用的操作指南和导航功能.相比网站,它更适合用于复杂的,单页网站类型的应用程序.Touris ...

  5. js简单显示和隐藏div,触发超链接,动态更改button值,setInterval()简单使用,jquery easyui弹出框简单使用 .

    js简单显示和隐藏div .<!DOCTYPE html> .<html> .<head> .<meta charset="UTF-8"& ...

  6. Gulp.js - 简单、直观的自动化项目构建工具

    Gulp.js 是一个简单.直观的构建系统.崇尚代码优于配置,使复杂的任务更好管理.通过结合 NodeJS 的数据流的能力,你能够快速构建.通过简单的 API 接口,只需几步就能搭建起自己的自动化项目 ...

  7. Node.js简单介绍并实现一个简单的Web MVC框架

    编号:1018时间:2016年6月13日16:06:41功能:Node.js简单介绍并实现一个简单的Web MVC框架URL :https://cnodejs.org/topic/4f16442cca ...

  8. JS简单入门教程

    JS简单教程 使用方法:放到任意html页面的head标签下 Test1方法弹出当前时间对话框 Test2方法for循环输出 Test3方法for(…in…)输出数组内容 <script typ ...

  9. js简单实现链式调用

    链式调用实现原理:对象中的方法执行后返回对象自身即可以实现链式操作.说白了就是每一次调用方法返回的是同一个对象才可以链式调用. js简单实现链式调用demo Object.prototype.show ...

随机推荐

  1. iis发布----在XP中发布高版本web遇到问题总结

    解决方法是之前在网上看到的,总结一下. 我在vs2010中做的web网页,放到XP系统中发布是遇到问题,XP中的iis版本是iis. 提示.net framework版本上的问题. 1.在网站属性中把 ...

  2. zombodb 索引创建

      索引的创建是zombodb 的核心,我们都是需要先创建table,然后创建索引,创建的时候我们可以指定es 集群的地址,同时可能需要使用 一些地址api(比如数据直接存储在es 中而不是pg 中) ...

  3. 【浅色】最强Win7 x64评测

    [浅色]最强Win7 x64评测 [浅色]最强Win7 x86 & x64 | WINOS https://www.winos.me/archives/789.htmlESD671MB,安装后 ...

  4. Office_PPT_让你一分钟完成上百张图片的快速保存

    1 方式 修改PPT文件格式,由PPT修改为rar,再进行解压操作 进入到ppt->media中找到你在PPT为文件中使用的图片. 2 PPT北京图片下载网址 别样网:https://www.s ...

  5. Python模块subprocess

    subprocess的常用用法 """ Description: Author:Nod Date: Record: #-------------------------- ...

  6. 20165312 2017-2018-2《JAVA程序设计》第8周学习总结

    20165312 2017-2018-2<JAVA程序设计>第8周学习总结 一.第十二章知识点总结 进程与线程 进程是程序的一次动态执行进程,它对应了从代码加载.执行至执行完毕的一个完整过 ...

  7. Runtime 解读

    首先,第一个问题, 1>runtime实现的机制是什么,怎么用,一般用于干嘛? 这个问题我就不跟大家绕弯子了,直接告诉大家, runtime是一套比较底层的纯C语言API, 属于1个C语言库, ...

  8. 华硕R系列的解剖图

    1.键盘底部 2.右侧光驱,右下硬盘 3.电源 4.主板 5. 6.4G内存

  9. 在consul上注册web服务

    1. 创建web服务 IDEA->File->New->Project->Empty Project,project name取名provider,点击finish 2. 创建 ...

  10. element-ui input输入框回车事件

    <el-input maxlength="30" v-model="answerInput" @keyup.enter.native="addA ...