iOS6 Safari changement d'orientation bug?

Je vais avoir un comportement rare dans Safari et iOS6. Lors d'un changement de paysage à portrait, la fenêtre est redimensionnée, mais il paraît qu'on est pas correctement positionné horizontalement. Il déplacées exactement 128px à gauche.

Je suis en mesure de reproduire ce comportement à un iPad3 dans iOS6 va www.google.com

Si vous modifiez les propriétés d'affichage du html comme ceci:

document.querySelector("html").style.display = "none"
document.querySelector("html").style.display = "block"

de la fenêtre d'affichage revient à l'origine et son affiche correctement. C'est pourquoi je pense que c'est un bug.

Toutes les idées de comment résoudre ce problème?

source d'informationauteur oliferna

  1. 10

    J'avais remarqué un problème similaire ce matin.

    À tout moment de l'orientation a changé de paysage à portrait, l'ensemble de l'élément de corps serait déplacé près de la moitié du chemin vers la gauche, où il devrait être de 100% de largeur. Cela a été le mobile de safari dans iOS 6, en cours d'exécution sur un iPhone 4s.

    J'ai cloué à la pleine largeur de la barre de recherche j'ai eu. Sur l'élément parent de ce bar, j'ai placé une propriété de overflow: hidden;

    Cela a fini la résolution de mon problème. J'ai passé beaucoup de temps à inspecter d'autres sites et il ne peut pas résoudre votre problème. Par exemple, mon fix ne semblent pas être pris sur BestBuy.com qui rencontre le même problème.

  2. 6

    Ce bug s'applique également à IOS6 sur iPhone.

    Retrait et la lecture de l'espace réservé dans une orientationchange gestionnaire de résoudre le problème. Cette solution est jQuery spécifiques:

    $(window).on("orientationchange", fixIOS6PlaceholderBug);

function fixIOS6PlaceholderBug () {
    var $this,
        originalPlaceholder = "";

    $(document).find("input[placeholder]").each(function() {
        $this = $(this);
        originalPlaceholder = $this.attr("placeholder");
        $this.removeAttr("placeholder").attr("placeholder", originalPlaceholder);
    });
}
  3. 2

    J'ai trouvé la solution grâce à ce:
    http://www.tonylea.com/2010/safari-overflow-hidden-problem/

    J'ai eu de débordement:caché dans ma balise HTML, depuis que j'ai certains de rotation DIVs caché à gauche et à droite, mais il semble que Safari dans iOS6 n'était pas d'accepter que. Paramètre de position:relative à la balise HTML résolu le problème pour moi!

  4. 2

    J'ai le même bug, mais dans mon cas, la raison en était un input type=text avec width: 100%; et quand j'ai changé d'entrée wrapper pour overflow:hidden bug a été corrigé;

    Solution avec overflow:hidden pour le corps est mauvais pour le défilement à inertie sur iOS

  5. 0

    J'ai dû ajouter overflow: hidden à la balise body.