Programmiererforum

Ich erstelle diesen Abschnitt einer Website, auf dem Bilder im Ansichtsfenster in Sicht gehen würden. Ich habe gerade etwas über Schnittbeobachter gelernt und versucht, ihn zu implementieren, und es funktioniert einwandfrei. Und ich möchte es nicht wieder neu definieren. < /P>
useEffect(() => {
const toggleSectionImageLg = () => {
// Code for larger screens
};

let observer;
const toggleSectionImageMobile = () => {
const callback = (entries) => {
entries.forEach((entry) => {
if (entry.isIntersecting) {
entry.target.classList.add("show");
} else {
entry.target.classList.remove("show");
}
});
};

const options = {
root: null,
threshold: 0.8,
};

observer = new IntersectionObserver(callback, options);
const targets = document.querySelectorAll(".feature-img-mobile");
targets.forEach((target) => observer.observe(target));
};

if (window.innerWidth > 900) {
window.addEventListener("scroll", toggleSectionImageLg);
return () => {
window.removeEventListener("scroll", toggleSectionImageLg);
};
} else {
toggleSectionImageMobile();
return () => {
if (observer) {
const targets = document.querySelectorAll(".feature-img-mobile");
targets.forEach((target) => observer.unobserve(target));
}
};
}
}, []);
< /code>
Ich habe versucht, die Beobachtervariable draußen mit LET zu deklarieren, aber immer noch nichts.>