2012-01-13 25 views
5

Estoy haciendo una aplicación web para Android y iPhone. Mi problema es que quiero actualizar la página web cuando el usuario va al paisaje. Como soy un principiante en JavaScript, no sé cómo hacer esto. Por favor, ayúdameCómo hacer una actualización de una página web cuando el usuario se vuelve móvil al paisaje

+2

Existe una pregunta como esta y una respuesta;) http://stackoverflow.com/questions/850472/how-do-i-detect-when-the- iphone-goes-into-landscape-mode-via-javascript-is-ther – matzino

+0

@ManseUK Gracias U – FreshBits

+0

por favor cierre esta pregunta para evitar duplicados – Murtaza

Respuesta

5

Se podría utilizar el evento orientationchange jQuery Mobile y luego hacer un

window.location.reload(); 

para actualizar la página.

Por ejemplo:

$(function(){ 

// Set Inital orientation 
// get the initial orientation from window which 
// returns 0 for portrait and 1 for landscape 
if(window.orientation == 0){ 
    var ori = "portrait"; 
}else{ 
    var ori = "landscape"; 
} 
changeOrientation(ori); 

// Orientation Change 
// When orientation changes event is triggered 
// exposing an orientation property of either 
// landscape or portrait 
$('body').bind('orientationchange',function(event){ 
    changeOrientation(event.orientation) 
}) 

// Change the style dependengt on orientation 
function changeOrientation(ori){ 
    // Remove all classes separated by spaces 
    $("#orientation").removeClass('portrait landscape'); 
    $("#orientation").addClass(ori); 
    $("#orientation").html("<p>"+ori.toUpperCase()+"</p>"); 
} 

}); 
+0

He utilizado su código como este, todavía no funciona "" – FreshBits

+0

@yuzi He actualizado mi código, pero sugiero que eche un vistazo a i n para jquery y jquery móvil (que este ejemplo está usando) – Johan

+1

finalmente me gustó esto, luego funciona "window.onorientationchange = function() { var orientation = window.orientation; interruptor (orientación) { case 0: window.location.reload(); break; caja 90: window.location.reload(); break; caja -90: window.location.reload(); break; } } " gracias Johan – FreshBits

0

Se puede usar un temporizador y comprobar periódicamente:

if (window.innerHeight > window.innerWidth) { 
    // Redirect code, window.location... 
} 
+2

Si height> width, el móvil estaría en modo vertical, no horizontal – Johan

Cuestiones relacionadas