Cómo obtener el ancho de ventana correcto en el cambio de orientación para dispositivos Android, tabletas y móviles
Estoy intentando calcular el ancho de la ventana en el cambio de la orientación para los dispositivos androides usando la función jquery $(window).outerWidth(true);
. Este cálculo da la anchura correcta en el cambio de la orientación para el iphone
y el ipad
pero no en androide. Si inicialmente cargar la página en modo horizontal o vertical, estoy recibiendo el ancho correcto, pero una vez que cambie la orientación después de cargar la página estoy recibiendo el ancho para el modo retrato como estaba en modo horizontal y viceversa. Por favor, sugiera lo que está sucediendo y cómo puedo manejar este problema para que pueda obtener el ancho de ventana correcta en el cambio de orientación en el dispositivo Android
- ¿Qué significa este Android Lint: "Orientación errónea?"
- Descripción de la orientación del teléfono Android, incluida la brújula
- Captura de video de MediaRecorder en modo retrato
- Establecer la orientación para sólo 1 fragmento en mi actividad, mientras que el resto está en el retrato
- IScroll no funciona en android a menos que realice un cambio de orientación y regrese
- ¿Cómo reemplazar adecuadamente Sensor.TYPE_ORIENTATION (que ahora está obsoleto)?
- Visualización de imágenes de la tarjeta sd en gridview android
- La orientación del dispositivo Android es Paisaje, pero los sensores se comportan como si la orientación fuera Retrato
- ¿Cómo no guardar el estado de la vista en Android?
- ¿Cómo debo calcular el azimut, el tono, la orientación cuando mi dispositivo Android no es plano?
- Cambio de orientación Crash Application
- Android - Cómo acercarse al algoritmo de detección de caídas
- La mejor práctica para manejar el cambio de orientación: Android
¿Por qué no utilizar el objeto de screen
javascript. Usted debe ser capaz de obtener las dimensiones de la pantalla con:
screen.height; screen.width;
También estaba atascado en este problema y encontrar la mejor solución que funcionará en todas las platforms.Below es el código del evento 'orientationchange'.
function onOrientationChange(event) { setTimeout(function(){ 'Enter you code here'; },200); }
Espero, que te ayudará y la mayoría de los demás también .. Saludos.
Este post parece tener una solución que puede ser relevante para usted:
http://forum.jquery.com/topic/orientationchange-event-returns-wrong-values-on-android
En lugar de escuchar el evento orientationchange , puede escuchar el evento de redimensionamiento de ventana, se asegurará de que las propiedades de window.innerHeight / outerHeight se actualizaron.
Intente window.innerWidth
, respectivamente, window.innerHeight
; Es posible que android no sobre outerWidth y Height;
var isMobile = { Android: function () { return navigator.userAgent.match(/Android/i); }, BlackBerry: function () { return navigator.userAgent.match(/BlackBerry/i); }, iOS: function () { return navigator.userAgent.match(/iPhone|iPad|iPod/i); }, Opera: function () { return navigator.userAgent.match(/Opera Mini/i); }, Windows: function () { return navigator.userAgent.match(/IEMobile/i); }, webOS: function () { return navigator.userAgent.match(/webOS/i); }, any: function () { return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows()); } }; var tell_if_mobile; var mobile_tablet; if (isMobile.any()) { tell_if_mobile = true; } else { tell_if_mobile = false; var windowWidth = window.screen.width < window.outerWidth ? window.screen.width : window.outerWidth; tell_if_mobile = windowWidth < 800; mobile_tablet = windowWidth >= 500 ? "Tablet/Phablet Device" : "Desktop View (Mobile)"; } var mobile_type; mobile_type = isMobile.Android() ? "Android Device" : isMobile.BlackBerry() ? "Blackberry Device" : isMobile.iOS() ? "iOS Device" : isMobile.Opera() ? "Opera Mobile/Mini" : isMobile.Windows() ? "IEMobile" : isMobile.webOS() ? "webOS device" : tell_if_mobile == true ? mobile_tablet : "Not a mobile device"; alert(mobile_type); //result