vue-lazy-images
vue-lazyload-images
A plugin of lazy-load images for Vue2.x
Support images lazyload in window or build-in element.
Demo
Installation
npm
$ npm install vue-lazy-images
or
script
<script src="dist/VueLazyImages.js"></script>
Usage
Entry.js
import Vue from "vue"
import VueLazyImage from "vue-lazy-images";
Vue.use(VueLazyImage)
Template
<lazy-image
:src='url'
:img-class='string' //or :img-class="['classname1','classname2']"
:placeholder='url of placeholder or loading image'
/>
Options
Vue.use(VueLazyImage,options)
| key | description | default | type |
|---|---|---|---|
| offset | offset distance for pre-loading | 0 | Number |
| events | events that you want parentNode listen for | ['scroll', 'wheel', 'mousewheel', 'resize', 'animationend', 'transitionend', 'touchmove'] | Array |
| throttle | spacing interval of continuous calling | 0(ms) | Number |
| debounce | idle time between two actions | 0(ms) | Number |
Related Packages
vue-visual
Vue 2 image and video loader supporting lazy loading, background videos, fixed a...
7,698
59
Version History
| Version | Released | Vue | License |
|---|---|---|---|
| 1.4.6 | ^2.2.6 | MIT | |
| 1.4.5 | ^2.2.6 | MIT | |
| 1.4.4 | ^2.2.6 | MIT | |
| 1.4.3 | ^2.2.6 | MIT | |
| 1.4.2 | ^2.2.6 | MIT | |
| 1.4.1 | ^2.2.6 | MIT | |
| 1.4.0 | ^2.2.6 | MIT | |
| 1.3.1 | ^2.2.6 | MIT | |
| 1.3.0 | ^2.2.6 | MIT | |
| 1.2.3 | ^2.2.6 | MIT | |
| 1.2.2 | ^2.2.6 | MIT | |
| 1.2.1 | ^2.2.6 | MIT | |
| 1.2.0 | ^2.2.6 | MIT | |
| 1.1.10 | ^2.2.6 | MIT | |
| 1.1.9 | ^2.2.6 | MIT | |
| 1.1.8 | ^2.2.6 | MIT | |
| 1.1.7 | ^2.2.6 | MIT | |
| 1.1.6 | ^2.2.6 | MIT | |
| 1.1.5 | ^2.2.6 | MIT | |
| 1.1.4 | ^2.2.6 | MIT | |
| 1.1.3 | ^2.2.6 | MIT | |
| 1.1.2 | ^2.2.6 | MIT | |
| 1.0.0 | ^2.2.6 | MIT |