Skip to content

Observe Your HTML Element

Check whatever HTML element in viewport

Bakunya

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)