Intersection Observer

by hyeyoon

HTML

<img src="https://picsum.photos/500/200" alt="">
<img src="https://picsum.photos/500/200" alt="">
<img src="https://picsum.photos/500/200" alt="">
<img src="https://picsum.photos/500/200" alt="">
<img src="https://picsum.photos/500/200" alt="">
<img src="https://picsum.photos/500/200" alt="">
<img src="https://picsum.photos/500/200" alt="">

JavaScript

const element = document.querySelectorAll('img');

const observer = new IntersectionObserver((entries) => { 
  entries.forEach(entry => console.log(entry.target, entry. intersectionRatio));
}); 
 
observer.observe(element);