Skip to content

Instantly share code, notes, and snippets.

@frydlewicz
Last active March 8, 2020 18:05
Show Gist options
  • Save frydlewicz/74562dbb92a82f97813af2a62cba4de9 to your computer and use it in GitHub Desktop.
Save frydlewicz/74562dbb92a82f97813af2a62cba4de9 to your computer and use it in GitHub Desktop.
Lazy loading script for images and backgrounds
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
(function(g,f,j,i,h){$(window).on("load",function(){i=0;$("["+g+"]").each(function(){function a(b){h=b.attr(f);if(b.attr(g)=="style"){b.css("background-image","url("+h+")")}else{b[0].src=h}}setTimeout(a,++i*j,$(this))})})})(
"data-lazyLoading", // attribute for type
"data-src", // attribute for src
100 // delay in milliseconds
);
</script>
<img data-lazyLoading data-src="https://frydlewicz.pl/photo/Warszawa/DSC07655.jpg" alt>
<div data-lazyLoading="style" data-src="https://frydlewicz.pl/photo/Warszawa/DSC07644.jpg"></div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment