Hallo,
da ist mir doch neulich bei nem Kumpel was doofes aufgefallen...
Da hab ich mir so viel Mühe gegeben, damit die Webseite unserer Band auf allen Browsern gleich aussieht (der I-Ex mal wieder als Problemkind Nr.1), und dann macht einem die moderne Technik wieder einen Strich durch die Rechnung.
Aber fangen wir vorne an: HORUS-web.de ist die besagte Webseite (CSS-Datei gibts hier) und wie dem geneigten Betrachter auffallen könnte, habe ich mit "position: fixed;" gearbeitet um das Menü und die Fußleiste an ihrem Platz zu halten. Das funktioniert auf normalen Rechner auch in so gut wie jedem Browser (mir hat noch keiner berichtet es gäbe Probleme). Jetzt hab ich die Seite neulich mal bei nem Freund über sein I-Phone aufgerufen, und musste feststellen, dass "position: fixed;" dort auch funktioniert, nur etwas anders. Die Fußzeile und das Menü scrollen nämlich mit, was zu dem Problem führt, das Teile des Inhalts grundsätzlich verdeckt sind.
Meine Vermutung: Der Browser des I-Phones lädt die Seite, wie sie bei einer 800x600er Bildschirmauflösung aussehen würde, und erstellt dann eine Art erweiterten Screenshot, auf dem auch das drauf ist was sich unterhalb der Bildschirmkante befindet, damit die Seite scroll- und zoom-bar wird. Auf so einem Screenshot bleiben Grafiken natürlich wo sie sind, und scrollen mit... blöde Sache das.
Meine Lösungs-Idee: Kopf und Fußzeile wie bei vielen anderen Seiten auch, als grundsätzlich mitscrollend auslegen, und zwar jehweils ganz oben bzw ganz unten vom Inhalt. Dies aber nur fürs I-Phone.
Frage: Wie? Lässt sich das mit einer Browser-Weiche machen? So weit ich weiß arbeitet das I-Phone mit dem Safari-Browser, der normale Safari des I-Mac stellt die Seite aber richtig dar. Wie kann ich also filtern ob die Anfrage von einem I-Phone kommt? Und wenn ich die Browser-Weiche habe, wie überschreibe ich dann die Positions-Angaben in der originalen CSS-Datei?
Die Änderungen selbst sind garnicht so aufwändig. Die Kopfzeile bekommt ein "position: absolute;" und die Fußzeile ein "position: relative;" und schon hat sich das ganze.
Und um das Problem gleich noch etwas umfassender zu erschlagen: Gibt es noch andere Mobile-Browser die behaupten sie könnten "das richtige Internet" darstellen und trotzdem Probleme damit haben könnten?
TIA
Look
da ist mir doch neulich bei nem Kumpel was doofes aufgefallen...
Da hab ich mir so viel Mühe gegeben, damit die Webseite unserer Band auf allen Browsern gleich aussieht (der I-Ex mal wieder als Problemkind Nr.1), und dann macht einem die moderne Technik wieder einen Strich durch die Rechnung.
Aber fangen wir vorne an: HORUS-web.de ist die besagte Webseite (CSS-Datei gibts hier) und wie dem geneigten Betrachter auffallen könnte, habe ich mit "position: fixed;" gearbeitet um das Menü und die Fußleiste an ihrem Platz zu halten. Das funktioniert auf normalen Rechner auch in so gut wie jedem Browser (mir hat noch keiner berichtet es gäbe Probleme). Jetzt hab ich die Seite neulich mal bei nem Freund über sein I-Phone aufgerufen, und musste feststellen, dass "position: fixed;" dort auch funktioniert, nur etwas anders. Die Fußzeile und das Menü scrollen nämlich mit, was zu dem Problem führt, das Teile des Inhalts grundsätzlich verdeckt sind.
Meine Vermutung: Der Browser des I-Phones lädt die Seite, wie sie bei einer 800x600er Bildschirmauflösung aussehen würde, und erstellt dann eine Art erweiterten Screenshot, auf dem auch das drauf ist was sich unterhalb der Bildschirmkante befindet, damit die Seite scroll- und zoom-bar wird. Auf so einem Screenshot bleiben Grafiken natürlich wo sie sind, und scrollen mit... blöde Sache das.
Meine Lösungs-Idee: Kopf und Fußzeile wie bei vielen anderen Seiten auch, als grundsätzlich mitscrollend auslegen, und zwar jehweils ganz oben bzw ganz unten vom Inhalt. Dies aber nur fürs I-Phone.
Frage: Wie? Lässt sich das mit einer Browser-Weiche machen? So weit ich weiß arbeitet das I-Phone mit dem Safari-Browser, der normale Safari des I-Mac stellt die Seite aber richtig dar. Wie kann ich also filtern ob die Anfrage von einem I-Phone kommt? Und wenn ich die Browser-Weiche habe, wie überschreibe ich dann die Positions-Angaben in der originalen CSS-Datei?
Die Änderungen selbst sind garnicht so aufwändig. Die Kopfzeile bekommt ein "position: absolute;" und die Fußzeile ein "position: relative;" und schon hat sich das ganze.
Und um das Problem gleich noch etwas umfassender zu erschlagen: Gibt es noch andere Mobile-Browser die behaupten sie könnten "das richtige Internet" darstellen und trotzdem Probleme damit haben könnten?
TIA
Look
