Hi Leute,
ich habe folgendes Problem: Ich möchte die Thumbnails auf meiner Webseite immer in der gleichen Auflösung von 200x130px anzeigen lassen, unabhängig von dem Zoom-Level des Browsers (Zoom über Strg+Plus/+Minus). Normalerweise werden sie einfach mitgezoomt.
Setze ich die Breite des Thumbnails nach jedem onResize-Event über Javascript wieder auf 200, bringt dies nichts, weil der Browser das Thumbnail im gezoomten Zustand sowieso wie ein Thumbnail mit Breite 200 behandelt, nur dass er die Fenstergröße künstlich verkleinert (imaginäre Fenstergröße). Ich dachte mir nun, dass ich mir den Zoom-Faktor durch die tatsächliche "physikalische" und künstliche "imaginäre" Fenstergröße des Browsers berechne, also
Thumbnail.width = 200 * ( window.imaginaryWidth / window.physicalWidth ).
Wenn z.B. das Browserfenster 400px auf meinem Bildschirm einnimmt, der Browser nach der ersten Zoomstufe das Fenster aber wie ein 200px breites Fenster behandelt, würde ich eine imaginäre Breite von 200 * (200/400) = 100px für das Thumbnail erhalten, was dann genau passen dürfte.
Leider spucken mir alle mir bekannten Javascript-Browserfenster-Größen wie window.innerHeight und window.outerHight die imaginäre Größe aus. Auch mit den JQuery Attributen $(window).height() und $(window).attr("innerHeight") etc. lässt sich nur auf die imaginäre Größe zugreifen (Tests in FF 3.5.6).
Hat jemand einen Tip, wie man an die physikalische Größe des Browserfensters in jeder Zoomstufe kommt?
Danke und Grüße