Desde 1994 en la Red. La pagina de los aficionados a la electronica, informatica y otras curiosidades de la vida. No dudes en visitarnos.
Ahora 1 visitas.| 3406598 Visitas (desde Dic. 2011), hoy: 279 Visitas 585 Pag. Vistas , ultimos 36 dias: 10143 Visitas. 37952 Pag. Vistas. Tu IP: 3.234.244.181
Que ando curioseando:
AutosuficienciaCosas de casaElectronicaEn InternetInformáticaMundo MisticoSin categoríaSociedadTe lo recomiendo

Ocultar barra de navegación en aplicaciones web móviles

Una regla en el desarrollo de aplicaiones web móviles es la de aprovechar siempre el máximo espacio que ofrecen las pantallas de los dispositivos, con iOS y Android empleando WebKit como motor de renderización en sus navegadores tienes la posibilidad de construir versiones de una web para posteriormente visualizarla como una aplicación nativa.

Con el siguiente código lograremos ocultar la barra de navegación cuando tengamos en pantalla nuestra web abierta:

window.addEventListener("load",function() {
 setTimeout(function(){
 window.scrollTo(0, 1);
 }, 0);
 });

El método window.scrollTo es la clave para esconder la barra de navegación. La función envolvente setTimeout es requerida por el dispositivo iPhone para poder ocultar la barra. El no usar setTimeout puede ocasionarnos algunos problemas.

Como bonus davidwalsh nos ofrece un truco a modo de que si un usuario añade nuestra aplicación web como favorita en su dispositivo, poder quitar de forma automática la barra de navegación, simplemente utilizando la siguiente metaetiqueta:

<meta name="apple-mobile-web-app-capable" content="yes" />

La barra de direcciones estará oculta hasta que el usuario recorra de abajo hacia arriba la aplicación. Con la barra de direcciones oculta, la aplicación web se verá exactamente como una aplicación nativa.

Comentarios (2)

Luis2 noviembre 2014 at 14:39

Tu método, que por cierto ya conocía, funciona correctamente en la mayoría de dispositivos, pero por alguna razón que no alcanzo a comprender, no va en un LG L5.
Inclluso si haces un scroll con jquery a por ejemplo un id de la mitad de una extensa página, éste se efectua correctamente, pero la barra sigue ahí.
Que extraño :(

MANUEL CASTRO18 enero 2017 at 17:51

exelente aporte muchos saludos!!

Escribe un comentario

Tu comentario