Bildergrösse in Abhängigkeit von Auflösung
Stefan
- html
Hallo,
gibt es eine Möglichkeit die Grösse eines Bildes in Abhängigkeit von der Bildschirmauflösung fest zulegen.
Ich habe mal gelesen, dass man die Größe auch in Prozent angeben kann:
<img src="test.gif" width="80%" width="80%">
Oder muss man per JavaSkript die Auflösung ermitteln und dann die Bilder dynamisch einfügen?
Kennt jemand eine Lösung ohne JavaSkript?
Bye
Stefan
Hallo Stefan.
gibt es eine Möglichkeit die Grösse eines Bildes in Abhängigkeit von der Bildschirmauflösung fest zulegen.
Einmal abgesehen davon, dass die Bildschirmauflösung für dich gänzlich irrelevant ist (merke: du suchst den zur Verfügung stehenden Platz, Viewport genannt), gibt es in CSS die Möglichkeit der Media Queries, welche momentan nur von Opera unterstützt werden.
Oder muss man per JavaSkript die Auflösung ermitteln und dann die Bilder dynamisch einfügen?
Du wirst wohl oder übel die Größe des Viewports (http://de.selfhtml.org/javascript/objekte/all.htm#offset_width@title=offsetWidth und http://de.selfhtml.org/javascript/objekte/all.htm#offset_height@title=offsetHeight) ermitteln und daraufhin das passende Bild setzen müssen.
Kennt jemand eine Lösung ohne JavaSkript?
Erzeuge eine Grafik, die nahtlos in eine Hintergrundfarbe übergehen kann.
Einen schönen Freitag noch.
Gruß, Ashura
Hallo,
Ich habe mal gelesen, dass man die Größe auch in Prozent angeben kann:
<img src="test.gif" width="80%" width="80%">
Ja, kann man. Aber Prozent von was? Standard ist das Elternelement, also z.B. ein Tabellenfeld.
Und nun gehen die Unterschiede der Browser los, was als 100% angesehen wird, je nachdem ob du noch padding, border usw. definiert hast.
Ein Test:
Erzeuge einen <div> über die gesamte Breite und Höhe des sichtbaren Bereichs, margin, padding und border auf Null setzen.
+------------------------+
| |
| Bild |
| |
| |
+------------------------+
Darin das Bild mit width=80%
Und nun verändere die Fenstergröße, das Bild sollte sich mitverändern.
LG Kalle
hi Kalle,
danke für den Tipp.
Werde es mal testen.
Bye
Stefan