Estoy tratando de rehacer el efecto de desplazamiento desde este sitio web: https://wemakefab.com/
gsap.registerPlugin(ScrollTrigger); gsap.to(".scroll-content",{ scrollTrigger:{ trigger:".scroll-content", start:'top top', end:'bottom bottom', scrub:1.2, markers:true }, y:-document.querySelector('.scroll-content').offsetHeight })En realidad, se traduce en el desplazamiento, pero también crea un gran espacio en blanco al final del sitio web. En el ejemplo, están poniendo css overflow: oculto en el cuerpo, pero para mí bloquea completamente el desplazamiento.
<div class="scroll-content"> <section class="green"></section> <section class="blue"></section> <section class="green"></section> <section class="blue"></section> <section class="green"></section> <section class="blue"></section> <section class="green"></section> <section class="blue"></section> <section class="green"></section> <section class="blue"></section> </div>Para solucionar esto, finalmente puse un contenedor alrededor del contenido de desplazamiento con una altura de 100vh y todo parece funcionar a la perfección.