El sitio web funciona bien en el escritorio. Pero cada vez que lo abro en el móvil e intento desplazarme hacia abajo, solo el texto se aleja y la página se detiene. El sitio web usa skrollr core para usar animación. Ya intenté usar overflow:scroll; y -webkit-overflow-scrolling:touch Cada vez que me desplazo me quedo con una imagen en blanco, y si me desplazo hacia atrás, el texto volverá a aparecer. https://test-bau.glitch.me
* { margin: 0; padding: 0; box-sizing: border-box; position: relative; font-family: 'Poppins', sans-serif; } body { overflow-x: hidden; } .banner { position: relative; width: 100%; height: 100vh; background: #3475ca; display: flex; justify-content: center; align-items: center; } .banner img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.25; } .content { position: relative; max-width: 750px; text-align: center; } .content h2 { color: #fff; font-size: 60px; } <body> <section class="banner"> <header> <a href="#" class="logo">Brand Name</a> <div class="toggle"></div> </header> <img src="https://cdn.glitch.global/4aea147e-dfa7-4bb5-b6b1-92c06733000c/bg.jpg?v=1653905576692"> <div class="content" data-0-top="opacity:0;left:100px;" data-200-top="opacity:1;left:0px;" > <h2>Success by Design</h2> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut. </p> </div> </section>Probablemente skrollr.js está causando el problema. La biblioteca no ha estado en desarrollo activo desde 2014.
Puedo sugerir https://scrollrevealjs.org/ o https://michalsnik.github.io/aos/