jQuery Mobile Richtungsereignis

jQuery Mobile orientationchange-Event

Das orientationchange-Event wird ausgelöst, wenn der Benutzer das Gerät vertikal oder horizontal dreht.

Mobile

Mobile

Um das orientationchange-Event zu verwenden, fügen Sie es dem window-Objekt hinzu:

$("window").on("orientationchange",function(){
  alert("Die Richtung hat sich geändert!");
});

Die callback-Funktion kann einen Parameter setzen, nämlich das event-Objekt, das die Richtung des mobilen Geräts zurückgibt: "portrait" (die Richtung, in der das Gerät gehalten wird, ist vertikal) oder "landscape" (die Richtung, in der das Gerät gehalten wird, ist horizontal):

Beispiel

$("window").on("orientationchange",function(event){
  alert("Die Richtung ist: " + event.orientation);
});

Probieren Sie es selbst aus

Da das orientationchange-Event mit dem window-Objekt verbunden ist, können wir die window.orientation-Eigenschaft verwenden, um beispielsweise verschiedene Stile zur Unterscheidung zwischen Portrait- und Landscape-Ansicht zu setzen:

Beispiel

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

Probieren Sie es selbst aus

Tipp:Die window.orientation Eigenschaft gibt für portrait-Ansicht 0 zurück, für landscape-Ansicht 90 oder -90.