Morton 24 de Abril de 2011 a las 06.33
   Imprimir artículo
elWebmaster.com

C贸mo ocultar la barra de navegaci贸n en tus aplicaciones web mobile con JavaScript


javascriptwide2Con iOS y Android utilizando WebKit como motor de renderizaci贸n en sus navegadores, puedes realizar versiones de tu web que se ver谩n como aplicaciones nativas. Con algunas simples lineas de c贸digo lograremos, por ejemplo, ocultar la barra de navegaci贸n para aprovechar al m谩ximo el tama帽o de la pantalla.

Al principio puede sonar complejo, pero 隆No lo es! Tan s贸lo necesitamos un poco de Javascript:

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

El m茅todo window.scrollTo es la clave para esconder la barra de navegaci贸n. La funci贸n envolvente setTimeout es requerida por los dispositivos iPhone para poder ocultar la barra. El no usar setTimeout puede ocasionarnos algunos problemas.

Eso fue todo. 隆Esperamos que te sea de utilidad!

Fuente original del art铆culo: David Walsh Blog
Traducci贸n realizada por
elWebmaster.com


Enviar a Del.icio.us Enviar a Meneame Enviar a Digg Enviar a Fresqui Enviar a Enchilame

Comentarios (6)

  1. jos茅 dice:

    ah, ok, si yo tengo google chrome, o safari puedo hacerlo no?

  2. Juan Pablo dice:

    en mi ipad esto no funciona, sigo viendo la barra de navegacion

  3. Rub茅n dice:

    No es por nada pero la funci贸n scrollTo solo sirve para posicionar el scroll el el punto que le digamos. En el c贸digo que pones sirve para poner el scroll horizontal, en la posici贸n 0, y el vertical en la 1, pero no tiene nada que ver con la barra de direcciones.

  4. Len dice:

    Lo hice para una aplicaci贸n .net y no funciona en mi iPad.
    Tienen algunas otra soluci贸n.

  5. kuku dice:

    No funciona para nada ya prob茅 varias veces, no oculta la barra de direcciones

  6. Nilton Salazar dice:

    Muchas gracias! Funciona perfecto! :) (probado desde mi XPERIA con Android)

Deja tu opinión

© 2007 - 2008 elWebmaster.com | Powered by Wordpress | Diseño CSS y XHTML válido. | Algunos íconos basados en FamFamFam Mini
Iniciar sesi贸n