Reinhard M.: Grafikgröße an Seitengröße anpassen

Ich möchte eine Grafik einbinden (z.B. 900x600).
Ist die aktuelle Größe der Seite am Bildschirm größer als diese Auflösung, soll das Bild mit 900x600 angezeigt werden.
Ist sie allerdings kleiner, soll die Bildbreite gleich der Seitenbreite sein (100%) und die Bildhöhe auch proportional dazu schrumpfen.

Ist dies möglich?

  1. n'Abend,
    du kannst Bilder über getElementById oder ähnliches ansprechen und die größe ändern. Mach doch einfach eine Funtion die onLoad geladen wird und mit InnerWidth http://de.selfhtml.org/javascript/objekte/window.htm#inner_height die Fenstergröße ausliest. ist der wert zu klein verändert die Funktion die Bildgröße.
    Einen Schönheitsfehler hat das Ganze: Es funktioniert mit dem IE nicht, siehe dazu den Link.

    mfg, hoffe dir wenigstens annähernd geholfen zu haben, Julian

  2. Hi,

    Ist dies möglich?

    Klar, mit JavaScript ist dies möglich.

    Ich habe mal sowas wüst und auf die Schnelle zusammengehackt - geht also besser:

    HTML:
    <img src="bild.jpg" width="762" height="762" name="bild" alt="">

    JavaScript:
    var picWidth=762; picHeight=762;
    var maxWidth=762, maxHeight=762;
    if(document.images && document.images["bild"] && (doc_width<maxWidth || doc_height<maxHeight) ) {
      var q=Math.min(doc_width/maxWidth,doc_height/maxHeight);
      document.images["bild"].width=Math.ceil(picWidth*q); document.images["bild"].height=Math.ceil(picHeight*q);
    }

    pic... sind die realen Größen,
    max... die maximal erwünschten,
    q der Quotient und
    doc_... sind Variabe mittels Coding: Systemvariable ermittelt.

    Gruß, Cybaer

    --
    Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!