wake-up-neo.com

Android Web App: Position: behoben defekt?

Ich bin dabei, eine Webanwendung für Handys zu entwickeln. Ich Ging mit Webanwendungen, weil es für mich eine Gewinnsituation zu sein scheint Sie müssen eine Anwendung entwickeln, die auch auf dem iPhone /Windows Mobile/Palm usw. ausgeführt werden kann.

Ich habe heute mit dem Testen begonnen, nachdem ich einige Tage lang Konzepte, Ideen und Entwürfe gemacht hatte. Was ich wollte, war ein Menü, das an der Unterseite der Seite klebt. Genauso wie das Menü unten in diesem iPhone Anwendungs-Screenshot:

enter image description here

Mit CSS würde ich mir vorstellen, dass dies sehr einfach wäre. Nur mit Position: fest; unten: 0; hätte den Trick gemacht, aber ich habe gefundenit verhält sich auf mobilen Browsern nicht gleich

Ich habe versucht, meine Seite in zwei Abschnitte aufzuteilen: 1 wäre ein scrollbarer div (Für den Inhalt) und der andere wäre das untere Menü . Scrollbare divs funktionieren auch nicht auf Android. Ich habe auch versucht, Frames zu verwenden. Kennt jemand eine Möglichkeit, ein Menü neu zu erstellen, __, das für Mobiltelefone am unteren Rand einer Seite bleiben würde?

32
StevenGilligan

Bei meinem Android N1 mit CyanogenMod hatte ich auch dieses Problem und das Update:

   <meta
     name="viewport"
     content="width=100%; 
             initial-scale=1;
             maximum-scale=1;
             minimum-scale=1; 
             user-scalable=no;"
    />

Insbesondere der user-scalable=no;-Teil kann anstelle von no auch 0 eingefügt werden.

Interessanterweise bricht dies das Androiden-Rendering von Schaltflächen, aber Sie müssen lediglich eine Hintergrundfarbe für Schaltflächen festlegen.

50
rizzle

Einfach hinzufügen:

<meta name="viewport" content="width=device-width, user-scalable=no" />

auf die Seite und Sie sind für Android 2.2+ eingestellt. Dies funktionierte auf einer Seite, die ich auf meinem Handy testete. Quelle: Wann kann ich die CSS-Position verwenden: behoben?

16
kad81
4
Lyon

Ich habe gerade ein Upgrade auf Android 2.2 (Froyo) auf meinem HTC Desire erhalten, und ich freue mich, sagen zu können, dass die fixierte Position jetzt funktioniert, zumindest wenn Sie das Viewport-Meta-Tag verwenden, um die Anfangskala und die Breite festzulegen. Trotzdem scheint es nicht auf regulären Webseiten zu funktionieren.

1
Anders Ekdahl

Ich bestätige das anhand des Metanamens in Ihrem HTML-Header 

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

sie haben ein festes div beim vertikalen und horizontalen Scrollen unter Android 2.2, 2.3 und höher und iOS 4 und höher Ich habe hier ein Beispiel erstellt: https: //dl.dropbox. de/u/908148/website/test-scroll.html

0
Luca Iulian