diff --git a/gallery.html b/gallery.html index 4cc8cf8..e9649e2 100644 --- a/gallery.html +++ b/gallery.html @@ -10,48 +10,50 @@ Car Meet Gallery - + + + \ No newline at end of file diff --git a/js/lazyloading.js b/js/lazyloading.js new file mode 100644 index 0000000..8a7fbf6 --- /dev/null +++ b/js/lazyloading.js @@ -0,0 +1,20 @@ +function lazyLoad() { + const lazyImages = document.querySelectorAll('img[data-src]'); + + const observer = new IntersectionObserver((entries) => { + entries.forEach((entry) => { + if (entry.isIntersecting) { + const lazyImage = entry.target; + lazyImage.src = lazyImage.dataset.src; + lazyImage.classList.remove('lazy'); + observer.unobserve(lazyImage); + } + }); + }); + + lazyImages.forEach((lazyImage) => { + observer.observe(lazyImage); + }); +} + +window.addEventListener('load', lazyLoad); \ No newline at end of file