Evento de direção do jQuery Mobile

Evento orientationchange do jQuery Mobile

O evento orientationchange é acionado quando o usuário rola vertical ou horizontalmente o dispositivo móvel.

Mobile

Mobile

Para usar o evento orientationchange, adicione-o ao objeto window:

$("window").on("orientationchange",function(){
  alert("A direção mudou!");
});

A função callback pode definir um parâmetro, o objeto event, que retornará a direção do dispositivo móvel: "retrato" (a direção em que o dispositivo é mantido é vertical) ou "paisagem" (a direção em que o dispositivo é mantido é horizontal):

Exemplo

$("window").on("orientationchange",function(event){
  alert("A direção é: " + event.orientation);
});

Experimente você mesmo

Devido ao evento orientationchange estar vinculado ao objeto window, podemos usar a propriedade window.orientation, por exemplo, para definir estilos diferentes para distinguir vistas retrato e paisagem:

Exemplo

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

Experimente você mesmo

Dica:A propriedade window.orientation retorna 0 para a visualização portrait e 90 ou -90 para a visualização landscape.