Trucos para tus aplicaciones web de iphone

Icono:

<link rel=”apple-touch-icon” href=”image.png” />

Notas: tamaño 57×57 px, el soft ya se encarga de añadrile el efecto shiny. Ver ejemplo

Ajustar el tamaño del texto y evitar que el usuario pueda cambiar el zoom:

<meta name=”viewport” content=”width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;”/>

Evitar el autocompletar en las cajas de texto:

<input type=”text” autocorrect=”off” />

Redondear elementos con CSS:

-webkit-border-radius: 10px;

Quitar los bordes de una caja de texto INPUT con CSS:

border:0;
-webkit-appearance: none; /* quitar borde gris de la parte superior */

Ocultar la barra de direcciones con javascript:

window.scrollTo(0,1);

Más trucos:

• Detectar el giro del dipositivo en horizontal o vertical con javascript
• Vía dotnetperls.com