Lightweight Performant Image Lazy Loading Script

Category: Javascript , Loading | December 17, 2021
Author:9D-Tony
Views Total:57 views
Official Page:Go to website
Last Update:December 17, 2021
License:MIT

Preview:

Lightweight Performant Image Lazy Loading Script

Description:

Just another lazy load JavaScript library for lazy loading images using the getBoundingClientRect() method, which is a web API used to determine the image’s position relative to the viewport.

How to use it:

1. Download and import the lazyload.js library into the document.

<script type="text/javascript" src="lazyload.js"></script>

2. Insert your images into the document using the data-src attribute. Note that all images to lazy load must be placed in the container called ‘images’.

<section id="image">
  <img data-src="image.jpg" width="800" height="650" />
</section>

You Might Be Interested In:


Leave a Reply