Javascript obtenir mobile la largeur de l'écran après le changement d'orientation

Je suis la capture de la orientationchange événement comme celui-ci:

            $(window).bind( 'orientationchange', function(e){

            });

Comment puis-je obtenir le nouvel écran largeur et la hauteur en pixels après le orientationchage?

J'ai essayé screen.width mais cela ne change pas, il reste que la largeur initiale, même après un changement d'orientation.

Avez-vous vu les recommandations here?

OriginalL'auteur ServerBloke | 2012-11-02

  1. 8
    $(window).bind( 'orientationchange', function(e){
    var ori = window.orientation,
        width = (ori==90 || ori==-90) ? screen.height : screen.width;
});
    Je ne suis pas sûr que ce serait tout rapide, mais il y a la possibilité de: width = Math.abs(window.orientation) == 90 ? screen.height : screen.width; Dont au moins sauve l'affectation d'une variable et d'une double évaluation de la même variable. (Mais un +1 pour la commutation d'un ternaire entre mon premier voir la question sur les mobiles et les commentaires.)
    C'est un micro-optimisation. La seule raison pour laquelle j'ai ajouté le ori variable était de garder la ligne de la trop longue.

    OriginalL'auteur Blazemonger

  2. 3

    Vous pouvez également utiliser screen.availWidth. Il est changé d'orientation.

    Cela devrait être accepté de Répondre!

    OriginalL'auteur Sarim

  3. 2

    Utilisation $(window).redimensionner, il court après orientationchange 

    $(window).resize(function(){
        //your logic
});
    J'ai voté cette réponse parce que les réponses précédentes sont à l'aide précédente largeur et la hauteur ( ceux d'avant la rotation, je pense que l'événement est déclenché juste après le mobile est mis en rotation tandis que la taille de la fenêtre (largeur) est toujours le même). $(window).redimensionner est déclenché après la rotation est terminée.

    OriginalL'auteur Alain Gauthier

  4. 1

    Si vous utilisez la balise meta viewport vous pouvez également mettre à jour cette balise (avec jquery exemple:)

            function adapt_to_orientation() {
        var ori = window.orientation;
        var screenwidth = (ori==90 || ori==-90) ? screen.height : screen.width;
        var screenheight = (ori==90 || ori==-90) ? screen.width : screen.height;
                  //resize meta viewport
                  $('meta[name=viewport]').attr('content', 'initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no,width='+screenwidth + ',height=' + screenheight);
                }   
        adapt_to_orientation();
        $(window).bind( 'orientationchange', adapt_to_orientation);

    OriginalL'auteur Air2