Nabend,

ich entwickle gerade eine Webapp und sitze vor einem größerem Problem.
Ich habe derzeit Buttons die fixed oben positioniert sind, bzw über Javascript nach dem Scrollen wieder passend nachpositioniert werden.
Das funktioniert soweit problemlos. Aber wenn der User nun ranzoomt, werden die Buttons auch vergrößert und verdecken dann den Content.
Und dem will ich nun entgegen wirken.

In der Theorie eigentlich ganz einfach. Bei Laden der Seite die aktuelle Breite des Bodys auslesen und zwischenspeichern, Resize-Event abfangen und neue Body-Breite auslesen. Anhand alter und neuer Breite dann den Zoomfaktor errechnen und die Buttons entsprechend über CSS-Transform-Scale runterskalieren.

Allerdings bin ich dabei auf ein Problem gestossen. Manche Browser speichern leider den Zoomfaktor und laden die Seite bereits gezoomt.
Daher bekomme ich als Startwert schon den falschen Wert und die Buttons werden dadurch dann kleiner als sie werden sollen.

Egal was ich mache, ich bekomme weder die korrekte Fenstergröße, noch die Bildschirmgröße heraus. Ob ich nun screen.height, body.offsetWidth, win.innerWidth, screen.availHeight oder sonstwas nehme, alle liefern mir einen errechneten Wert mit dem ich nichts anfangen kann.
Auch den Zoomfaktor bekomme ich nicht heraus (aus dem könnte ich ja dann die echte Breite errechnen).

Aber vielleicht gibt es ja hier einen guten Webentwickler, der mir bei dem Problem helfen kann.

Danke schonmal

Ich bin mir unsicher, ob ich Dich richtig verstehe. Wenn der Inhalt gescrollt wird und die Buttons immer am oberen Rand sichtbar bleiben, verdecken sie dann nicht automatisch und gewollt den Inhalt?
Dein Vorhaben hört sich aber prinzipiell schon sehr abenteuerlich an. Eventuell solltest Du überdenken, Dein Layout so umzustellen, dass ein Großteil der Anpassungen vom Browsers mittels entsprechender CSS-Befehle automatisch angewandt werden. Das kann allerdings kniffelig sein.
Wichtig wäre aber erstmal, dass ich verstehe, wo genau Deine Absichten liegen.

__________________
++++++++++[>+++>+++++++>++++++++++>+++++++++++<<<<-]>++>+.>+.>++++..<++++.>++.<<<.>++++++.>--------.>+.--.

Eher ne Gegenfrage: Warum per Javascript und nicht per CSS die Buttons fixed plazieren?

__________________
Lieben Gruß, Marco.

Tipps zur Suchfunktion | Foren-Regeln | Grundlagen Android | FAQ zum Motorola Defy | Was ist Root? | Barbie

Fixed positionieren geht bei Handybrowsern leider nicht. Das nachpositionieren über Javascript funktioniert bereits problemlos.
Was ich will ist, dass man die Seite zoomen kann, die Buttons aber nicht mitzoomen.

Also bei mir schon...
"position:absolute;" wird zumindest auf meinen installierten Browsern akzeptiert und nicht verändert.

Aber sorry fürs OT, ist keine Antwort auf die Threadfrage.

__________________
Lieben Gruß, Marco.

Tipps zur Suchfunktion | Foren-Regeln | Grundlagen Android | FAQ zum Motorola Defy | Was ist Root? | Barbie

"Position:absolute;" positioniert aber absolut auf der gesamten Seite. Beim scrollen scrollt das entsprechende Element aber mit. Das richtige wäre hier "Position:fixed". Das wird natürlich nicht vom IE 6 verstanden. Bei den mobilen Browsern kenne ich die Kompatiblität nicht.

Wenn man zoomt, sollten aber auch die Buttons gezoomt werden, zwecks Barrierefreiheit. Dein Layout solltest Du nochmal überdenken; Positionen und Größen des Layouts sollten ohne Javascript funktionieren.

__________________
++++++++++[>+++>+++++++>++++++++++>+++++++++++<<<<-]>++>+.>+.>++++..<++++.>++.<<<.>++++++.>--------.>+.--.

Wenn die Buttons mitgezoomt werden, dann werden die Buttons aber zur Barriere, weil diese ja immer oben links, bzw oben rechts positioniert sind.
Das Layout umbauen ist nicht möglich, die Buttons sollen oben sein und auch mitscrollen, damit man direkt Zugriff auf Zurück und Menubutton hat.

Hab mal eben ne kleine Grafik zur Anschauung gemacht. So wird deutlicher was das Problem ist (das Runde sind die Buttons)
Rechts ist der Button dann so groß, das er schon ein Viertel des Displays einnimmt. Dadurch kann man den Content dann nicht mehr wirklich lesen.

Ich könnte natürlich das Zoomen einfach komplett unterbinden, aber sowas mache ich nur ungern, da ich dem User diese Freiheiten gerne lassen will.
Oder ich lasse das nachpositionieren der Buttons sein, aber dann kommt man nicht mehr direkt ins Menu oder zurück. Quasi dasselbe als wenn man Javascript deaktiviert hat.

Miniaturansicht angehängter Grafiken

 

Aber wenn jemand so nah ranzoomt, dann hat er seine Gründe dafür. Dann darf auch auch ruhig die Knöppe größer sehn

__________________
++++++++++[>+++>+++++++>++++++++++>+++++++++++<<<<-]>++>+.>+.>++++..<++++.>++.<<<.>++++++.>--------.>+.--.

Ja er zoomt so nah ran, weil er das Bild im content genauer betrachten will und da darf der Button auf keinen Fall mitzoomen.
Oder er zoomt ran um den Text besser lesen zu können, aber kann es nicht, weil der Button alles verdeckt.
Und deswegen muss ich das irgendwie verhindern.

Bevor Du da irgendwelche krummen Lösungen bastelst, was hältst Du von einer Option, die Leiste auszublenden, wenn der Nutzer es wünscht?

__________________
++++++++++[>+++>+++++++>++++++++++>+++++++++++<<<<-]>++>+.>+.>++++..<++++.>++.<<<.>++++++.>--------.>+.--.