Skip to content

Latest commit

 

History

History
78 lines (52 loc) · 1.1 KB

README.md

File metadata and controls

78 lines (52 loc) · 1.1 KB

simple-lazyload

一个轻量级懒加载库,支持 imgbackground-imageclass 的懒加载和延时加载。 demo

快速上手

  1. 引入lazyload.js
<script src="./lazyload.js"></script>
  1. 实例化
const lazy = new Lazyload()
  1. set
// 支持 img ( 包含background-image )

lazy.set({
  mode: 'img',
  dataset: 'data-img',
  offset: '50%',  // 支持百分比
  delay: 1000,
})

// 支持 class
lazy.set({
  mode: 'class',
  dataset: 'data-class',
  offset: 200,  // 单位像素
})

以上便是简易教程,非常简单。

  1. 另外,支持链式调用
lazy.set({
  mode: 'img',
  dataset: 'data-img',
  offset: '50%',
  delay: 1000,
}).set({
  mode: 'class',
  dataset: 'data-class',
  offset: '-30%',  // 支持负值
}).set({
  mode: 'img',
  dataset: 'data-img-custom',
  offset: '-30%',
  delay: 0,
})

结语

  • 使用方法到此结束,具体可以参考demo.html
  • 若是好用,欢迎star

Todos

  • 使用Gulp编译出ES5版本。
  • 发布npm包。