2014-12-09 13 views
7

OS: iOS 8.1.1 Browser: Safari Telefon: iPhone 5CWebseite immer 100% Höhe nicht in Twitter App auf iOS 8

Wir haben eine Webseite, die 100% nimmt Höhe und Breite. Wir haben das Ansichtsfenster gesperrt, sodass der Benutzer die Seite nicht vertikal oder horizontal scrollen kann. Diese Seite wird auf Twitter über den Safari Webbrowser geteilt. Wenn wir die Webseite in der Twitter-App ansehen, wird der untere Teil der Seite abgeschnitten. Wir können die Seite nicht vollständig anzeigen. Auch wenn wir die Ausrichtung mehrmals ändern, ist der abgeschnittene Teil nicht sichtbar.

Die Höhe des Teils, der abgeschnitten wird, entspricht der Höhe des Headers des Twitter-App-Containers (der Teil mit dem Kreuz-Button, Seitentitel/URL und Link teilen) und der Statusleiste (der Teil mit Netzwerkstatus-Symbol, Uhrzeit, Akkuladestand usw.)

Hinweis: Dieses Verhalten wird in iOS 8 nur beobachtet.

Antwort

3

Für alle anderen über das kommende, das Update ich am Ende mit war

window.addEventListener("resize", function(){ 
     onResize(); 
    }); 

    function onResize(){ 
     document.querySelector("html").style.height = window.innerHeight + "px" 
    }; 

    onResize(); 

dies in der neuesten Version von Twitter Browser auf Safari zu funktionieren scheint.

5

Das hat mich in den letzten Stunden auch verrückt gemacht. Die Lösung ist nicht basierend Höhen/Breiten px oder Prozentsatz zu verwenden, sondern position:fixed auf html und body Elemente verwenden, dann Top-Einstellung, links, rechts, unten auf 0. So Ihr Code sieht wie folgt aus:

html, body{ 
    position:fixed; 
    top:0; 
    left:0; 
    right:0; 
    bottom:0; 
} 

Dies erzwingt, dass der Inhalt nur so breit und so groß ist wie das in twitters webview-Komponente dargestellte Ansichtsfenster, ohne zu überlaufen. Jeder Code innerhalb des Körpers kann nun 100% in jeder Richtung sein, ohne Angst haben zu müssen, versteckt zu sein. Dieser Fehler betrifft auch iOS9. Bestätigt, dass das Update auf iOS9.1 mit der neuesten Twitter App auf ip6/6 +, ip5 und ip4 funktioniert.