style.top = ""

[Michael S]

Hallo zusammen,

ich benutze Stylesheets um kleine Grafiken auf einer Hintergrundgrafik zu positionieren und entweder sichtbar oder unsichtbar darzustellen:

#i1_1 { position:absolute; top:171px; left:250px; visibility:hidden;}

<div id="i1_1"><img name="i1_1r" src="p_rt.gif" alt=""></div>

if (x)
 document.getElementsByTagName("img")[i].style.visibility = "hidden";
else
 document.getElementsByTagName("img")[i].style.visibility = "visible";
Das ganze funktioniert auch völlig problemlos!

Da ich jetzt noch die Höhe meiner Grafiken verändern wollte dachte ich mir, folgendes müsste auch gehen:
document.getElementsByTagName("img")[i].style.top = "350px";
Tja, aber das dachte ich auch nur. Das ganze funzt nicht.

Ich habe auch den Inhalt von .style.visibilty in eine Variable gelesen, das klappt reibungslos.
Wenn ich das jedoch mit .style.top versuche, habe ich eine Variable "", sprich definiert aber leer.

Liegt das Problem nun zwischen meinen Ohren, 30cm vor dem Bildschirm des Programmierers oder in der weissen Farbe die auf das entsprechende Blatt Papier gefallen ist, wo dieses definiert sein sollte?

Hat jemand nee gute Idee (oder eine Peitsche die dem Esel vor meinem TFT mal die Hirnwindungen resetet)

Danke
Michael

[EKKi]

Mahlzeit,

#i1_1 { position:absolute; top:171px; left:250px; visibility:hidden;}

<div id="i1_1"><img name="i1_1r" src="p_rt.gif" alt=""></div>

document.getElementsByTagName("img")[i].style.top = "350px";

Wenn ich das jedoch mit .style.top versuche, habe ich eine Variable "", sprich definiert aber leer.

Du hast dem <img>-Element mit der ID "i1_1r" ja auch nirgendwo eine style-Eigenschaft "top" zugewiesen, geschweige denn dieser einen Wert verpasst. :-) Das <div>-Element mit der ID "i1_1" hingegen hat eine entsprechende Eigenschaft - aber die fragst du ja nicht ab ... ;-)

Liegt das Problem nun zwischen meinen Ohren, 30cm vor dem Bildschirm des Programmierers oder in der weissen Farbe die auf das entsprechende Blatt Papier gefallen ist, wo dieses definiert sein sollte?

Ich vermute ersteres ... ;-)

MfG,
EKKi

[Michael S]

Jau,
es sind meine Ohren!!!

Du hast völlig recht, ich muss mit dem <div> handwerkeln und nicht mit dem <img>.
Bei .visibility reicht es interresanterweise, wenn ich das aufs <img> beziehe, um die notwendige Änderung herbeizuführen. Wahrscheinlich ist das "zugehörige" <div> selber noch auf "hidden".

Danke für den hilfreichen Klapps auf den Hinterkopf

Michael

[Antipitch]

Hi Michael,

Du hast völlig recht, ich muss mit dem <div> handwerkeln und nicht mit dem <img>.

Nein, musst du nicht. Du musst nur tun, was Gunnar geschrieben hat. Du willst doch keinen Wert auslesen, sondern einen zuweisen. top macht aber keinen Sinn, wenn kein Wert für position vorhanden ist. Also beides zuweisen.

Jau,
es sind meine Ohren!!!

Gruß
Antipitch

[Gunnar Bittersmann]

Hello out there!

Da ich jetzt noch die Höhe meiner Grafiken verändern wollte dachte ich mir, folgendes müsste auch gehen:
document.getElementsByTagName("img")[i].style.top = "350px";
Tja, aber das dachte ich auch nur. Das ganze funzt nicht.

"'top' [...] Angewendet auf: Positionierte Elemente" [CSS2 §9.3.2]

Das Bild ist aber nicht "positioniert":

"'position' [...] Vererbt: Nein [CSS2 §9.3.1]

Liegt das Problem nun zwischen meinen Ohren

Darüber hat sich EKKi schon geäußert; ich kann da nicht widersprechen. ;-)

See ya up the road,
Gunnar

[Der Martin]

Hallo,

<div id="i1_1"><img name="i1_1r" src="p_rt.gif" alt=""></div>

ergänzend zu den anderen Antworten: Warum sperrst du das img-Objekt noch in ein unnötiges div? Du kannst das Bild ebensogut direkt formatieren und positionieren.
Dann hättest du auch keine Chance gehabt, dich mit den beiden Elementen zu verhaspeln.

if (x)
document.getElementsByTagName("img")[i].style.visibility = "hidden";
else
document.getElementsByTagName("img")[i].style.visibility = "visible";

Oder übersichtlicher (finde ich jedenfalls):

document.getElementsByTagName("img")[i].style.visibility = (x ? "hidden" : "visible");

Liegt das Problem nun zwischen meinen Ohren, ...

Nett formuliert, muss ich mir merken! ;-)

Ciao,
 Martin

[Michael S]

Hiho,

<div id="i1_1"><img name="i1_1r" src="p_rt.gif" alt=""></div>
ergänzend zu den anderen Antworten: Warum sperrst du das img-Objekt noch in ein unnötiges div? Du kannst das Bild ebensogut direkt formatieren und positionieren.

Ich lagere an verschiedenen Punkten mehrere Images übereinander und schalte nur das, welches die richtige Farbe (ala Ampel) hat auf "visible". Für die Positionierung muss ich dadurch die Position nur einmal festlegen und kann sie trotzdem mit sehr wenig Bytes mehrfach verwenden. Das spart erheblich Platz, da ich für die gesamte Site nur ca. 200Kb Platz zur verfügung habe.

Thx nochmals an alle für die Hilfe,

Michael