intersection observer example
const images = document.querySelectorAll('.lazyload');
function handleIntersection(entries) {
entries.map((entry) => {
if (entry.isIntersecting) {
entry.target.src = entry.target.dataset.src;
entry.target.classList.add('loaded')
observer.unobserve(entry.target);
}
});
}
const observer = new IntersectionObserver(handleIntersection);
images.forEach(image => observer.observe(image));intersectionobserver threshold
const box = document.querySelector(".box");
const callbackFunction = function(entries){
if(entries[0].isIntersecting) {
entries[0].target.children[0].classList.add("changeColor");
// Stop observating because we made the Element appear
observer.unobserve(fadeElement);
}
};
const observer = new IntersectionObserver(callbackFunction, {
// Here you can add some Options you can find on the documentation
threshold: [0.5] // The Function triggers when you can see 50% of the Element
});
observer.observe(box)Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
