Estoy tratando de hacer que una clase aparezca en un elemento en función de la posición de otros elementos. Entonces, básicamente, cuando aparece el primer elemento, tiene un atributo data-anchor="position", y el elemento que se supone que tiene efecto tiene un atributo data-anchor="item". Cuando data-anchor="position" ingresa a la ventana de vista, se supone que debe agregar una clase, y cuando sale, se supone que debe eliminar la clase. La parte de posición/elemento encuentra el primero y luego enciende y apaga el nombre de la clase. Hay otra parte de la secuencia de comandos que busca un atributo de animación de datos y agrega una clase cuando ese elemento aparece. Esta parte funciona bien, pero la incluí en caso de que haya algún conflicto. Configuré un violín para mostrar esto. Cualquier orientación es muy apreciada.
// Loop to add class on items with data-position attribute var anchor = window.requestAnimationFrame || // IE Fallback function(callback){ window.setTimeout(callback, 1000/60)}; var anchorToShow = document.querySelectorAll('[data-anchor="position"]'); function anchorloop() { anchorToShow.forEach(function (anchorPos) { if (isElementInViewport(anchorPos)) { document.querySelector('[data-anchor="item"]').classList.add('fixed-object'); } else { document.querySelector('[data-anchor="item"]').classList.remove('fixed-object'); } }); anchor(anchorloop); } anchorloop();