Gli ultimi tutorial di sviluppo web
 

jQuery Mobile Orientamento Event


Evento jQuery Mobile orientationChange

L'evento orientationChange viene attivato quando l'utente ruota il dispositivo mobile verticalmente o orizzontalmente.





Mobile


Per utilizzare l'evento orientationChange, attaccarlo alla oggetto finestra:

$(window).on("orientationchange",function(){
  alert("The orientation has changed!");
});

La funzione di callback può avere un solo argomento, l'oggetto evento, che restituisce l'orientamento del dispositivo mobile: "portrait" (il dispositivo viene tenuto in posizione verticale) o "landscape" (il dispositivo viene tenuto in posizione orizzontale):

Esempio

$(window).on("orientationchange",function(event){
  alert("Orientation is: " + event.orientation);
});
Prova tu stesso "

Poiché l'evento orientationChange è legato all'oggetto finestra, possiamo utilizzare la proprietà window.orientation, ad esempio, impostare gli stili differenti per distinguere tra le visualizzazioni verticale e orizzontale:

Esempio

$(window).on("orientationchange",function(){
  if(window.orientation == 0) // Portrait
  {
    $("p").css({"background-color":"yellow","font-size":"300%"});
  }
  else // Landscape
  {
    $("p").css({"background-color":"pink","font-size":"200%"});
  }
});
Prova tu stesso "

La proprietà window.orientation restituisce 0 per il ritratto e 90 o -90 per la vista del paesaggio.