2013-09-22 5 views
12

Ich habe Probleme mit einem Vollbild-Bildschirm (auf Home-Bildschirm gespeichert) iPhone Web-App auf iOS7.webkit-overflow-scrolling Formulare auf iOS 7 Vollbild-Web-App gebrochen

Wenn ein Eingang ausgewählt ist, ist er normalerweise über der Tastatur sichtbar.

Dies scheint jedoch nicht auf iOS7 für Scrollen DIVs in einer Vollbild-Web-App zu passieren.

Wenn also ein DIV "-webkit-overflow-scrolling: touch" verwendet und eine Eingabe in der unteren Hälfte des Bildschirms angeklickt wird, wird die Tastatur ausgelöst, aber die Eingabe wird nicht hochgescrollt.

UND zu diesem Zeitpunkt reagiert der Eingang nicht auf weitere onFocus-Ereignisse, mit denen ich sonst scrollen könnte.

Wer hat einen Workaround gesehen?

Antwort

17

Aktualisierung der Viewport-Meta-Tag für mich behoben.

ich änderte sich dies:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" /> 

Um dies:

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, target-densityDpi=device-dpi" /> 

height=device-height ist der eigentliche Update (ohne es das Ansichtsfenster verkleinert wird die Tastatur zur Aufnahme).

+1

Super! Das Einstellen der Höhe auf Gerätehöhe unterbricht einige andere Dinge in unserer App (wir haben eine feste Fußzeile, die sich über der Tastatur bewegt, wenn die Gerätehöhe verwendet wird, weil iOS7 die Gerätehöhe verringert, wenn die Tastatur anzeigt). ABER. . . Wenn man es explizit auf etwas sehr großes setzt, wie 10000 Pixel, funktioniert es meistens, und es werden viele zusätzliche Leerzeichen gespeichert. (Das zusätzliche Leerzeichen ist jedoch das kleinere Übel.) –

+2

target-densityDpi = Geräte-dpi ist veraltet und Sie können es leicht entfernen. https://petelepage.com/blog/2013/02/viewport-target-densitydpi-support-is-being-deprecated/ –

+0

Dies funktioniert für mich, aber dann bekomme ich dieses Problem: http://StackOverflow.com/questions/11804428/jquery-mobile-height-ausgabe-fuer-iphone-web-app-geht von-seite-hoehe-von-480-insa aus –

0

Es funktionierte auf meiner WebApp durch Entfernen der Höheneinstellungen.

Verwandte Themen