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. ScriptManager 发送错误到客户端

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx. ...

  2. PPTV(pplive)_forap_1084_9993.exe 木马清除经历

    ## 流氓行经 这几天电脑上突然自动安装pptv,金山毒霸清除了也不管用, 卸载了pptv过一会又自动安装上了,太嚣张了哈. ## 监控进程跟目录变化 接下来使用 ProcessMonitor 监控进 ...

  3. InnoDB存储引擎文件

    InnoDB存储引擎文件 MySQL数据库包括数据库本身的文件和存储引擎文件.数据库自身的文件由参数文件(my.cnf).错误日志文件.慢查询日志文件.查询日志文件.二进制日志文件.套接字文件.pid ...

  4. super超类继承特点小结

    super超类继承特点小结: 1. super并不是一个函数,是一个类名,形如super(B, self)事实上调用了super类的初始化函数,产生了一个super对象: 2. super类的初始化函 ...

  5. VUE中如何优雅的动态绑定长按事件

    答案没有: 图片是从后端传过来, 加到imgTarget属性,实现长按点击删除该图片 let img = document.createElement('img'); img.src = " ...

  6. [蓝桥杯]PREV-44.历届试题_青蛙跳杯子

    问题描述 X星球的流行宠物是青蛙,一般有两种颜色:白色和黑色. X星球的居民喜欢把它们放在一排茶杯里,这样可以观察它们跳来跳去. 如下图,有一排杯子,左边的一个是空着的,右边的杯子,每个里边有一只青蛙 ...

  7. JAVA 异常类型结构分析

    JAVA 异常类型结构分析 Throwable 是所有异常类型的基类,Throwable 下一层分为两个分支,Error 和 Exception. Error 和 Exception Error Er ...

  8. 关于ARM Linux下的SD卡及U盘的挂载问题

    内核配置并运行后,挂载SD卡,出现问题: zynq> mount -t /dev/mmcblk1 /mntmount: mounting /dev/mmcblk0 on /mnt failed: ...

  9. Node学习笔记(二)

    1.package.json详解Node.js 在调用某个包时,会首先检查包中 package.json 文件的 main 字段,将其作为包的接口模块,如果 package.json 或 main 字 ...

  10. [Oracle,2018-03-01] oracle常用函数

    最近经常用到一些oracle中的函数,今天就总结一些常用的: 一.单行函数 只处理单个行,并且为每行返回一个结果. 1.字符函数 (1)concat(str1,str2)字符串拼接函数 select ...