Como primer ejemplo de aplicación Web para nuestro dispositivo iPhone / iPod Touch, vamos a practicar con el evento encargado de controlar los cambios de orientación.

El ejemplo es bastante sencillo y nos muestra como en nuestro elemento body controlamos dicho evento onorientationchange() y tras llamar a la función que definamos (en nuestro caso orientationChange), detectamos a través de nuestro objeto window el tipo de orientación que hemos realizado.

<script type="application/x-javascript"><!--



function orientationChange()



{



 var str = "Orientation: ";



 switch(window.orientation)



 {



 case 0:



 	str += "Portrait";



 break;



 case -90:



 	str += "Landscape (right, screen turned clockwise)";



 break;



 case 90:



 	str += "Landscape (left, screen turned counterclockwise)";



 break;



 case 180:



 	str += "Portrait (upside-down portrait)";



 break;



 }



 



document.getElementById("mode").innerHTML = str;



}



// --></script>



 



 



<h4 id="mode">Ras sed nibh.</h4>



Donec semper lorem ac dolor ornare interdum. Praesent condimentum. Suspendisse



lacinia interdum augue. Nunc venenatis ipsum sed ligula. Aenean vitae lacus. Sed



sit amet neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices



posuere cubilia Curae; Duis laoreet lorem quis nulla. Curabitur enim erat, gravida



ac, posuere sed, nonummy in, tortor. Donec id orci id lectus convallis egestas.



Duis ut dui. Aliquam dignissim dictum metus.

Existen tres posibilidades, orientación hacia la derecha, hacia la izquierda y orientación completa de 180 grados. Para nuestro ejemplo cambiamos el texto de nuestro elemento h4 para mostrar que recibimos el evento correctamente.

Podemos probar este ejemplo en la dirección http://www.iphonesoftware.es/taller/orientacion/index.html