Probleme mit Intersection Observer

Jan-Frederik Stieler

Monsterator
Moderator
Hallo,

ich steh mit de mIntersection Observer etwas auf Kriegsfuß.
Und zwar möchte ich das wenn eine Farbfläche in den View kommt die Farbe von links ändern und dann wieder zurück wenn die Farbfläche den view verlässt.
Ich hab leider nichts dazu gefunden wie sich der Observer bei Margin des Objektes verhält. Ob das margin schon reicht um ein isIntersect als true zu setzen.
Wenn dies der Fall sein sollte wie kann ich dann das Margin vom target abziehen für den Observer?

Javascript:
let options = {
    rootMargin: '0px',
    threshold: 0
}

let callback = (entries, observer) => {
    entries.forEach((entry) => {
        let navlinks = document.querySelectorAll('.footer__menu--link');

        if (entry.isIntersecting) {
            navlinks.forEach((navlink) => {
                navlink.classList.add('footer__menu--link-white');
            });
        } else {
            navlinks.forEach((navlink) => {
                navlink.classList.remove('footer__menu--link-white');
            });
        }
    });
};

let observer = new IntersectionObserver(callback, options);

let target = document.querySelector('.xmas__page--02');
observer.observe(target);
 
Versuch macht kluch: Ich habe das mal ausgetestet mit dem Ergebnis, dass ein Margin nicht berücksichtigt wird. Bei threshold 0 wird "intersect" erkannt, wenn das Element ohne Margin beginnt, sichtbar zu werden und "not intersect" wenn es sich vollständig aus dem sichtbaren Bereich heraus bewegt hat.
 

Neue Beiträge

Zurück