tengo problemas con un control deslizante en codepen. Lo implementé en mi sitio web y me di cuenta de que el resaltador blanco del contenido se mueve si me desplazo por el sitio web. El resaltador blanco se mueve hacia arriba y hacia abajo. Realmente no sé cómo arreglar eso. El código original también tiene el mismo problema. Tal vez alguien tiene una idea? El Código está en codepen.io/JavaScriptJunkie/pen/ZMMRRQ
getBoundingClientRect() proporciona las coordenadas para el rectángulo que se ve actualmente en la pantalla. Simplemente agregando window.pageYOffset (es la altura sobre la ventana gráfica hasta la parte superior de la página) a la nueva coordenada Y, puede compensar esta posición Y cambiante.
Ver 16 en esta bifurcación de tu Codepen: https://codepen.io/yoat/pen/XWzqRKJ
var x = this.getBoundingClientRect().left; // only the y position changes, not the X or the height! var y = this.getBoundingClientRect().top + window.pageYOffset; var width = this.getBoundingClientRect().width; var height = this.getBoundingClientRect().height;