HTML Bildgröße maximal

Guten Tag,
ich möchte in einer tabellarischen Struktur mehrere Bilder untereinander zeigen. Die Basisbilder haben unterschiedliche Breiten. Ich würde gerne alle Bilder bis zu einer Maximalbreite von 250 pixeln anzeigen, größere werden bis 250 Pixel runterskaliert, kleinere bleiben in Originalgröße.
Wie kann ich da vorgehen?
Danke
MM

Hallo Michael,

ich möchte in einer tabellarischen Struktur mehrere Bilder
untereinander zeigen. Die Basisbilder haben unterschiedliche
Breiten. Ich würde gerne alle Bilder bis zu einer
Maximalbreite von 250 pixeln anzeigen, größere werden bis 250
Pixel runterskaliert, kleinere bleiben in Originalgröße.

die größeren mit einer class auszeichen, z.B.:

und in den head-bereich:

.kleiner {width:250px}

oder mit javascript

window.onload = function () {
var alle = document.getElementsByTagName(„img“);
var bis=alle.length;
for (var i = 0 ; i < bis ; i++){
if ( document.getElementsByTagName(„img“)[i].style.width < 250){
document.getElementsByTagName(„img“)[i].style.width = „250px“
}
}
}

Gruß
Klaus

Oder die Bilder doch einfach vorher skalieren. Nichts empfinde ich schlimmer als lange Ladezeiten weil ein Bild riesig ist und in der Anzeige runter skaliert wird.
Andreas

Ich würde gerne alle Bilder bis zu einer

Maximalbreite von 250 pixeln anzeigen, größere werden bis 250
Pixel runterskaliert, kleinere bleiben in Originalgröße.

skalieren alleine kann ich nicht empfehlen.
Zusätzlich die Bilder noch auf Speicherplatz einstellen ist zu empfehlen. Den Speicherplatz zwischen 10 - 15 kb halten.
Das kostenlose Grafik-Programm GIMP eignet sich hierzu.

Wave

hilft leider noch nicht so recht weiter
Hallo zusammen,
danke für die Meinungen. Die Bilder runterskalieren … so schlau bin ich auch, aber die Bilder werden mir permanent angeliefert und ich hab weder Zeit noch Lust, das zu tun.
Daher kann ich auch nicht die Bilder größenabhängig mit eigenen Tags auszeichnen.
Gibts da keine Alternative? Speicher- und Übertragsungsprobleme gibt es dabei nicht, es geht vor allem um Optik.
Danke
MM

Hallo,

Gibts da keine Alternative?

hast Du den Vorschlag mit dem Javascript nicht gelesen?
Ist der zu kompliziert?
Na gut … noch einer.

jeden img-tag damit ausstatten:
onload="test(this)"

Und so wird getestet und gegebenenfalls geändert:

function test (das) {
if ( das.style.width < 20){ das.style.width=„20px“}
}

… z.B. der IE max-width für nicht interpretiert

Hallo,

Die Bilder runterskalieren … so
schlau bin ich auch, aber die Bilder werden mir permanent
angeliefert und ich hab weder Zeit noch Lust, das zu tun.

Dann automatisier es doch.

Gruesse,
Moritz