Responsive designe für images?

[lord_fritte]

Hallo ich beschäftige mich gerade mit ein bisschen Responsive designe.
In CSS klappt das ganz gut(mit dem @media tag), aber wie kann ich sowas auf Bilder anwenden?
Ich habe z.b. ein Vorschaubild:

<img src="img/vorschau.jpg"></img>

Jetzt möchte ich auf Mobilen Geräten, mit kleinem Display statt vorschau.jpg ein anderes Bild (vorschau_small.jpg) laden.
Natürlich könnte ich das Bild einfach skalieren, aber mit einer kleineren Datei würde ich Transfervolumen sparen.

 

[Banana_Jones]

Sencha.io beispielsweise bietet einen Service, Bilder quasi on-the-Fly zu verkleinern und dem responsive Layout anzupassen. Im Detail habe ich mich jetzt jedoch nicht damit beschäftigt, möglicherweise entspricht das nicht ganz deinen Anforderungen

 

[Cheffchen]

Hallo,

na in dem die Bidler auch responsive machst: Die Responsive Images Story

Cheffchen

 

[bodil]

Btw: Dein HTML-Code ist quatsch. Richtig wäre es so:

<img src="img/vorschau.jpg" />

oder so

<img src="img/vorschau.jpg">

(je nach Doctype.)

</img>

ist jedenfalls falsch.