Sometimes, we want to load images dynamically or lazily when users scrolls them into view with HTML.
In this article, we’ll look at how to load images dynamically or lazily when users scrolls them into view with HTML.
How to load images dynamically or lazily when users scrolls them into view with HTML?
To load images dynamically or lazily when users scrolls them into view with HTML, we can set the loading
attribute to lazy
.
For instance, we write
<img src="http://placeimg.com/640/360/any" loading="lazy" />
to set the loading
attribute to lazy
.
Then the image will be loaded only when it’s visible.
Conclusion
To load images dynamically or lazily when users scrolls them into view with HTML, we can set the loading
attribute to lazy
.