I have an intersection observer for one animation, but i want to use window.requestIdleCallback()
Where I should add the code window.requestIdleCallback(callback_1)?
my script:
if (document.querySelector('#weddings')) {
let observer_1;
let Element_1;
let prevRatio = 0.0;
let options = {
root: null,
rootMargin: "0px",
threshold: buildThresholdList()
};
// Set things up
Element_1 = document.querySelector("#img-1");
initObserver();
//////////////////////////////////////////////////////////////////////////////
function initObserver() {
observer_1 = new IntersectionObserver(callback_1, options);
observer_1.observe(Element_1);
}
/////////////////////////////////////////////////////////////////////////////
function buildThresholdList() {...}
/////////////////////////////////////////////////////////////////////////////
var gallerySroll_1 = anime({...});
////////////////////////////////////////////////////////////////////////////
function callback_1 (entries, observer_1) {
entries.forEach((entry) => {
if(entry.boundingClientRect.top <= 0 && entry.intersectionRatio != prevRatio){
gallerySroll_1.seek(gallerySroll_1.duration * (entry.intersectionRatio));
}else{ gallerySroll_1.seek(1000); }
prevRatio = entry.intersectionRatio;
});
}
}
if I add the code at the start after the if before anything i got the error:
TypeError: entries.forEach is not a function
callback_1 https://alessiopaolettidesign.it/ph/js/main.js:343