Evento direzionale di jQuery Mobile

Evento orientationchange di jQuery Mobile

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

Mobile

Mobile

Per utilizzare l'evento orientationchange, aggiungilo all'oggetto window:

$("window").on("orientationchange",function(){
  alert("La direzione è cambiata!");
});

La funzione callback può impostare un parametro, ovvero l'oggetto event, che restituisce la direzione del dispositivo mobile: "portrait" (la direzione in cui viene tenuto il dispositivo è verticale) o "landscape" (la direzione in cui viene tenuto il dispositivo è orizzontale):

Esempio

$("window").on("orientationchange",function(event){
  alert("La direzione è: " + event.orientation);
});

Prova a farlo tu stesso

Poiché l'evento orientationchange è associato all'oggetto window, possiamo utilizzare la proprietà window.orientation per, ad esempio, impostare stili diversi per distinguere la vista in orientazione portrait e landscape:

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 a farlo tu stesso

Suggerimento:L'attributo window.orientation restituisce 0 per la vista in posizione portrait e 90 o -90 per la vista in posizione landscape.