Saltar al contenido

Detectar cambios en la orientación usando javascript

Esta crónica ha sido analizado por nuestros expertos así se asegura la veracidad de nuestra esta reseña.

Solución:

ACTUALIZAR:

Es posible que desee comprobar

cambio de orientación de jQuery mobile

o el simple JS uno:

window.addEventListener("orientationchange", function() 
  alert(window.orientation);
, false);

MDN:

window.addEventListener("orientationchange", function() 
    alert("the orientation of the device is now " + screen.orientation.angle);
);

Respuesta anterior

http://www.nczonline.net/blog/2010/04/06/ipad-web-development-tips/

Safari en el iPad admite la propiedad window.orientation, por lo que, si es necesario, puede usarla para determinar si el usuario está en modo horizontal o vertical. Como recordatorio de esta funcionalidad:

window.orientation is 0 when being held vertically
window.orientation is 90 when rotated 90 degrees to the left (horizontal)
window.orientation is -90 when rotated 90 degrees to the right (horizontal)

También existe el evento de cambio de orientación que se activa en el objeto de la ventana cuando se gira el dispositivo.

También puede usar consultas de medios CSS para determinar si el iPad se sostiene en orientación vertical u horizontal, como:




http://www.htmlgoodies.com/beyond/webmaster/toolbox/article.php/3889591/Detect-and-Set-the-iPhone–iPads-Viewport-Orientation-Using-JavaScript-CSS-and-Meta-Tags .htm


Puede usar el evento de cambio de orientación así:

window.addEventListener('orientationchange', function()
     /* update layout per new orientation */
);

Puede usar mediaMatch para evaluar consultas de medios CSS, por ejemplo

window
    .matchMedia('(orientation: portrait)')
    .addListener(function (m) 
        if (m.matches) 
            // portrait
         else 
            // landscape
        
    );

La consulta de medios CSS se activa antes de que orientationchange. Si desea capturar el final del evento (cuando se haya completado la rotación), consulte la altura de la ventana gráfica móvil después del cambio de orientación.

Si haces scroll puedes encontrar las notas de otros programadores, tú igualmente eres capaz insertar el tuyo si lo crees conveniente.

¡Haz clic para puntuar esta entrada!
(Votos: 2 Promedio: 4)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *