Mi pregunta aquí es de dos partes. Pero todo relativo a entender más sobre cómo funciona el observador de intersección.

Obtengo todas mis 'secciones', recorro y aplico el observador a cada una. Mi objetivo es que si la sección se cruza, quiero aplicar un estilo, y para las que no se cruzan, no quiero que se aplique el estilo. en la carga de la página, todas mis secciones tienen el borde y no se alternan como esperaría. Además, en mi console.log (entrada), la entrada parece registrarse antes de que realmente se cruce con la sección.

Ejemplo: me estoy desplazando hacia arriba y todavía estoy claramente en el borde de la "sección 3", pero ya apareció el registro de la "sección 2".

Un poco de ayuda con una comprensión general y algunas posibles soluciones sería increíble.

 let allSections = document.querySelectorAll('section')

 const options = { root: null, threshold: 0, rootMargin: '0px' } const observer = new IntersectionObserver(function (entries, observer) { entries.forEach(entry => { if (entry.isIntersecting) { console.log('ENTRY', entry.target) entry.target.style.border = '1px solid red' } else { entry.target.style.border = '1px solid transparent' } }) }, options) allSections.forEach(section => { observer.observe(section) })