Observe Your HTML Element
Check whatever HTML element in viewport

Created by / Bakunya
JS
const options = {
root: null,
rootMargin: '0px',
threshold: 1
}
const callback = (entries, observer) => {
const [entry] = entries
if (entry.isIntersecting) {
console.log('your element in viewport')
//if you want to disconnect observe
observer.unobserve(entry.target)
}
}
const element = document.querySelector('.your-element')
const observer = new IntersectionObserver(callback, options)
observer.observe(element)