I am adding a class when a div gets into the viewport using Intersection Observer. I just can’t figure out how to remove the class when the div leaves the viewport. This is what I have so far:
const callback = function (entries) {
entries.forEach(entry => {
if(entry.isIntersecting)
{
entry.target.classList.add('animate1');
observer.unobserve(entry.target)
}
});
}
const observer = new IntersectionObserver(callback);
const targets = document.querySelectorAll('.overlay');
targets.forEach(target => {
observer.observe(target);
})