Responsive Image Lazy Load JavaScript Library – responsivelyLazy

Category: Javascript , Loading , Recommended | July 31, 2018
Views Total:294 views
Official Page:Go to website
Last Update:July 31, 2018


Responsive Image Lazy Load JavaScript Library – responsivelyLazy


responsivelyLazy is an ultra-light javascript library which allows you to delay the loading of appropriate images based on the width of their parent containers. Help you speed up the initial page load time to provide better user experience.

How to use it:

Load the responsivelyLazy’s JavaScript and CSS in the document.

<link href="responsivelyLazy.css" rel="stylesheet">
<script src="responsivelyLazy.js"></script>

Use data-srcset to specify a group of images for different screen resolutions.

<div class="responsively-lazy">
  <img src="placeholder.png" 
     data-srcset="image1.jpg 100w, image2.jpg 200w, image3.jpg 300w, ..."



Fix for data-lazycontent in IE.

You Might Be Interested In:

Leave a Reply