Höhe und Breite eine Images dynamisch anpassen

[Tolwin]

Hallo Forum,

ich versuche einem Image die Höhe eine DIV Tag zuzuweisen.
Die Höhe des DIV`s ermittel ich mit JS wie folgt:

function GiveValues(){
var breite = document.getElementById("contentDiv").offsetWidth;
var hoehe  = document.getElementById("contentDiv").offsetHeight;

Die ermittelten Werte möchte ich nun zwecks Größendefinition einem
Image zuweisen ... das habe ich so versucht

document.getElementById('rechts').Height  = hoehe + 18 +"px";

Der Höhe soll hierbei der Wert 18 addiert und die Größenangabe px angehängt werden.

Hier der DIV Tag und das Image

<div id="contentDiv" style="width:625px; height:350px; background-color:#FFFFFF; border-left: 2px solid #FF9900; border-top: 2px solid #FF9900;z-index:2;"><p>Ihre Vorteile im &Uuml;berblick </p></div>
<img id="rechts" src="/all/images/schatten_rechts.png" height="340px"  width="8px" style="margin:-10px 0px 0px 0px;z-index:1;" />

Das funktioniert so leider nicht ... könnte mir jemand sagen warum?

Schon mal vorab vielen Dank und Gruß
Tolwin

[Harlequin]

Yerf!

document.getElementById('rechts').Height  = hoehe + 18 +"px";

Das funktioniert so leider nicht ... könnte mir jemand sagen warum?

Die CSS-Angaben werden bei JS über das Style-Unterobjekt gesetzt:

document.getElementById('rechts').style.height  = hoehe + 18 +"px";

Gruß,

Harlequin

[Tolwin]

Danke für die Tipps.
Leider funktioniert es so nicht.
Habe jetzt im style="height:0px;" definiert .... er übernimmt aber
nicht die style.height aus dem JS ...

var breite = document.getElementById("contentDiv").offsetWidth;
var hoehe  = document.getElementById("contentDiv").offsetHeight;
document.getElementById('rechts').style.height  = hoehe + 18 +"px";

<img id="rechts" src="/all/images/schatten_rechts.png"  width="8px" style="margin:-10px 0px 0px 0px;z-index:1;height:0px" />

Was mache ich falsch? Darf ich kein height im IMG Tag definiert haben? Ein Test brachte auch keinen Erfolg

Grüße
Tolwin

[Harlequin]

Yerf!

Was mache ich falsch? Darf ich kein height im IMG Tag definiert haben? Ein Test brachte auch keinen Erfolg

Hm, schwer zu sagen, der Code sieht soweit eigentlich gut aus (Die offsetHeight ist tatsächlich ohne Einheit, weshalb hier kein parseInt benötigt wird). Schau mal, ob es irgendwelche JavaScript-Fehlermeldungen gibt (am besten in der Fehlerkonsole des Firefox). Wann und wie wird der Code eigentlich aufgerufen? Evtl. findet er zu diesem Zeitpunkt das Bild noch nicht.

Gruß,

Harlequin

[Tolwin]

so, jetzt klappt´s
hatte nur vergessen das JS per onload aufzurufen %-)
Aber nochmals vielen Dank für die Hilfe!
Grüße
Tolwin

[Kai345]

Grütze .. äh ... Grüße!

var breite = document.getElementById("contentDiv").offsetWidth;
var hoehe  = document.getElementById("contentDiv").offsetHeight;

Die ermittelten Werte möchte ich nun zwecks Größendefinition einem
Image zuweisen ... das habe ich so versucht

document.getElementById('rechts').Height  = hoehe + 18 +"px";

Der Höhe soll hierbei der Wert 18 addiert und die Größenangabe px angehängt werden.

was sagt alert(breite)? Wahrscheinlich ein Zahlenwert mit 'px' dahinter, also ein string. Damit kann man nicht rechen. Mit parseInt umwandeln.

Zwei (oder mehr) Mal die Referenz auf das gleiche Objekt zu suchen ist auch nicht notwendig.
Und du benutzt bei der Zuweisung .Height statt .height, wird wohl auch nicht funktionieren.

var meinDiv = document.getElementById("contentDiv");  
var breite = parseInt(meinDiv.offsetWidth,10);  
var hoehe  = parseInt(meinDiv.offsetHeight,10);

Damit kannst du rechen.

Cü
Kai