Vt-lazyload-plugin NPM

Lazyload plugin

Really small lazyload plugin (<4kB)

Install the package:

#install the npm package

npm i vt-lazyload-plugin

Import/use plgun:

import Vue from 'vue'
import lazyLoad from 'vt-lazyload-plugin'

Vue.use(lazyLoad)

Add the v-lazyLoad directive with the src of the image as attribute value.

Do not add the src Attribute or else that lazyload wont work.

with link:

 <img v-lazyLoad="https://via.placeholder.com/350x150" />

with prob/variable:

 <img v-lazyLoad="image.src" />

add a object to the Vue.use(lazyload)
Vue.use(lazyLoad, {margin: '0px 0px 100px 0px'})

Option	Type	Default value	Description
margin	string	'0px 0px 100px 0px'	Sets the distance between the viewport and the image before it gets loaded
fadeIn	string	'false'	If you want the images to fade in when scrolling by, set the value to any amount of seconds you want e.g. '1s'