Ich habe eine komplexe mobile Anwendung für Formulare über Daten erstellt und suche jetzt nach einer Lösung, um die Position des Titels und der Fußzeile beizubehalten. In meinem Dummy, der mit Chrome und Safari auf meinem Desktop entwickelt und getestet wurde, habe ich einfach die Kopfzeile und die Fußzeile absolut positioniert, sowie den Inhaltsbereich, dessen Höhe von JavaScript beim Größenänderungs-Event der Windows eingestellt wird. p>
Das ist kein richtiger Weg für die mobile Welt, da overflow: auto auf dem mobilen WebKit nicht unterstützt wird.
Ich habe ein paar Dinge selbst ausprobiert und ich habe auch einen Blick auf iScroll geworfen. Tatsächlich hat iScroll Safari auf meinem iPad abgestürzt, während die Anwendung ohne diese Komponente ziemlich flüssig läuft. Ich habe viele relativ komplexe Formen, was eine Herausforderung für iScroll sein kann, die nicht gewonnen werden kann, denke ich.
Ich suche also nach anderen Möglichkeiten, um mein Ziel zu erreichen (Kopf- und Fußzeile persistieren), ohne den Benutzer zwei Finger zum Scrollen verwenden zu lassen (tatsächlich kennt fast niemand diesen "Trick").
Irgendwelche Vorschläge?
Danke!
Also gibt es drei häufig erwähnte Lösungen:
Sie sind alle sehr gut zum Scrollen durch einfache Listen. Aber niemand funktioniert wirklich, wenn es darum geht, ganze Seiten mit mehr als nur einer Liste zu bearbeiten, zum Beispiel komplexe Dialoge mit dynamischen Formen und so weiter.
Ich habe gerade beschlossen, aufzugeben und ein Jahr zu warten - Apple hat kürzlich seine Unterstützung für position: fixed und overflow: scroll angekündigt, was diesen Teil revolutionieren wird und all diese Probleme lösen wird, die wir heute haben.
Heute erinnerte ich mich an eine Website einer Firma in unserem Gebäude hier in München, öffnete sie mit dem iPad, und tatsächlich hatte sie auf ihrer Titelseite eine scrollbare Nachrichtenabteilung. Also schaute ich hinein und sah, dass es ... tadaaa ... jScrollPane verwendet.
>Ich glaube nicht, dass jScrollPane für die Verwendung auf mobilen Geräten entwickelt wurde, aber es wurde auch für diesen Zweck optimiert. Es funktioniert einfach auf meinem iPad, meinem Android 2.3 und auch auf dem neuesten Opera Mobile.
Es ist nicht so, als ob Sie eine native App auf einem mobilen Gerät scrollen, aber Sie können eine vollständig anpassbare Bildlaufleiste sehen, nach oben und unten springen und, was am wichtigsten ist, mit einem Finger scrollen .
Sehr nett.
Das mobile Webkit unterstützt jetzt das Scrollen nur mit CSS. Erstellen Sie eine Klasse "scrollbar" und fügen Sie die folgenden Regeln hinzu:
%Vor%Fügen Sie Ihre scrollbare Klasse zu jedem Blockelement hinzu, das gescrollt werden muss. Nur Webkit.
Leichte, auf Polyfill basierende Lösung, die moderne Browser mit Überlauf ermöglicht: Scroll-Unterstützung macht ihr Ding.
Noch in der frühen Phase der Entwicklung, aber funktioniert ziemlich gut auf der größten betroffenen Benutzerbasis (Android 2.2 / 2.3 / iOS & lt; 5).
Tags und Links html android scroll mobile-safari mobile-webkit