Para uno de nuestros clientes, hemos creado una cartera de clics. Al deshabilitar el desplazamiento en la página y mover instantáneamente la página 100vh hacia abajo al hacer clic, creamos la ilusión de que vemos una nueva página, sin cargarla realmente. Funciona muy bien en el escritorio. Véalo aquí. Aquí está el javascript utilizado para lograrlo:

 <!-- Click area and on-click action --> <div class="click-next" onclick="scrollWin(0, window.innerHeight)"></div> <div class="click-back" onclick="scrollWin(0, window.innerHeight / -1)"></div> <script> // Scroll function function scrollWin(x, y) { window.scrollBy(x, y); } </script>

En el móvil, sin embargo, me encuentro con un problema. Al ingresar por primera vez a la página, la barra de búsqueda de Safari está visible. Al hacer clic, la página se desplazará hacia abajo en toda su altura, excluyendo la altura de la barra de búsqueda y compensando todo:

¿Cómo me aseguro de que el script se desplace 100vh, ignorando los elementos nativos del navegador móvil? (No soy un gurú de Javascript de ninguna manera. El sitio lo hizo en Webflow).