ocultar direcciones chrome barra javascript mobile-browser address-bar

javascript - chrome - ¿Cómo ocultar la barra de direcciones de un navegador móvil?



ocultar barra de direcciones chrome android (4)

Eche un vistazo a esta publicación de HTML5 - html5rocks.com/en/mobile/fullscreen básicamente puede usar JS, o la API de pantalla completa (mejor opción, IMO) o agregar algunos metadatos a la cabeza para indicar que la página es una aplicación web

Safari y Chrome en dispositivos móviles incluyen una barra de direcciones visible cuando se carga una página. A medida que el body de la página se desplaza, estos navegadores desplazarán la barra de direcciones fuera de la pantalla para dar más espacio al sitio web, como se muestra en esta imagen:

Estoy teniendo un pequeño problema con mi sitio permitiendo esto. Estoy trabajando en un Pokedex que contiene una lista muy larga de todos los Pokémon. Sin embargo, con la forma en que configuré la página, no quiere desplazar la barra de direcciones fuera de la vista.

Mi html se ve como:

<body> <app> <!-- My Angular2 tag for the app, no special styles for this --> <nav>...</nav> <!-- The red nav bar and hamburger menu, default bootstrap --> <div class="fluid-container">...</div> <!-- The container for all pokemon entries --> </app> </body>

Si me desplazo al final absoluto de la lista (eso es 721 entradas) entonces cualquier desplazamiento adicional moverá la barra de direcciones de la parte superior de la pantalla. Si toco la barra de navegación y la arrastro hacia arriba, la barra de direcciones se mueve fuera de la pantalla. Ambas parecen formas no intuitivas de hacer esto.

Me imagino que hay alguna forma de desplazarme por el cuerpo de la página con javascript que lo oculte, pero lo que he intentado hasta ahora no funciona. Ningún desplazamiento visible tuvo lugar cuando hice eso.

¿Cómo puedo desplazar la página lo suficiente para ocultar la barra de direcciones de un navegador móvil poco después de que se cargue la página?

EDITAR: Cuanto más analizo esto, más imposible parece hacerlo sin la interacción del usuario. Si requiero la interacción del usuario, ¿sería posible que el toque de un usuario en el centro de la pantalla primero intente desplazar el cuerpo antes de intentar desplazar el div con todas las entradas en él? Si esto funciona de la forma en que estoy pensando, primero deslizaría la barra de direcciones antes de deslizarse por la lista. Es algo así como lo contrario del comportamiento predeterminado del navegador, por lo que puede que no sea posible / fácil / confiable, pero estoy dispuesto a probar y ver si alguien tiene alguna idea.


Este debe ser el código que necesitas para ocultar la barra de direcciones:

window.addEventListener("load",function() { setTimeout(function(){ // This hides the address bar: window.scrollTo(0, 1); }, 0); });

Por cierto, también es bonito Pokedex. ¡Espero que esto ayude!


La forma más fácil de archivar la barra de direcciones del navegador que se oculta en el desplazamiento de la página es agregar "display": "standalone", al archivo manifest.json .


Sé que esto es viejo, pero tengo que agregar esto aquí ..

Y si bien esta no es una respuesta completa, es un "ADEMÁS DE"

La barra de direcciones no desaparecerá si NO estás usando https.

ADEMÁS

Si está utilizando https y la barra de direcciones aún no se oculta, es posible que tenga algunos errores de https en su página web (como el hecho de que ciertas imágenes se publiquen desde una ubicación que no sea https).

Espero que esto ayude..