[Vuejs]-How to use VueJs plugin vue-lazyload

by

0👍

the error was that I needed to fix a size to the container so that the library could work, this way the images were not loaded all at the same time. (just add height)

<div v-lazy-container="{ selector: 'img' }" style='height: 500px;'>
  <img data-src="https://images.pexels.com/photos/1677275/pexels-photo-1677275.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500">
  <img data-src="https://images.pexels.com/photos/1173777/pexels-photo-1173777.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500">
  <img data-src="https://images.pexels.com/photos/2827400/pexels-photo-2827400.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500">  
  <img data-src="https://images.pexels.com/photos/1612461/pexels-photo-1612461.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500">  
  <img data-src="https://images.pexels.com/photos/979003/pexels-photo-979003.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500">  
  <img data-src="https://images.pexels.com/photos/2444444/pexels-photo-2444444.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940">  
  <img data-src="https://images.pexels.com/photos/949380/pexels-photo-949380.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500">  
  <img data-src="https://images.pexels.com/photos/1656579/pexels-photo-1656579.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940">  
</div>

Leave a comment