Mehrere Text-divs ausblenden...

[stefancp]

Hallo Leute,

ich habe folgendes Problem...
In meiner Webseite soll beim Klick auf eines von 8 Thumbs zum einen das Bild im Anzeigefenster geändert werden (klappt auch) und zum anderen der Text daneben.
Ich habes es nun so gelöst, dass ich bei der Anweisung onclick zwei Variablen an eine Funktion übergebe. Die erste gibt an, welches Bild in dem Fenster angezeigt wird und die zweite, welches von 8 divs angezeigt werden soll. Diese divs hab ich allesamt erzeugt, per div
positioniert und per display=none" ausgeblendet. Um sicherzustellen, dass die Texte nicht
einander überdecken, soll die Funktion per For-Schleife alle divs ausblenden (über den Style display=none).
Die Funktion sieht wie folgt aus:

function bildwechsel(bild, text) {
document.images.showpicture.src=bild;
var blankid = "showtext0";
for (var i = 0; i < 9; i++) {
document.getElementById(blankid + i).style.display="none";
} 
document.getElementById(text).style.display="inline";
}

Der HTML-Code dazu:

<a href="#" onClick="bildwechsel('../../bilder/typen/efh01_gr.gif', 'showtext01')"><img class="typ_thmb" style="margin-left: 218px; margin-top: 148px" src="../../bilder/typen/efh01_kl.gif"></a>
<a href="#" onClick="bildwechsel('../../bilder/typen/efh02_gr.gif', 'showtext02')"><img class="typ_thmb" style="margin-left: 297px; margin-top: 148px" src="../../bilder/typen/efh02_kl.gif"></a>
<a href="#" onClick="bildwechsel('../../bilder/typen/efh03_gr.gif', 'showtext03')"><img class="typ_thmb" style="margin-left: 376px; margin-top: 148px" src="../../bilder/typen/efh03_kl.gif"></a>
.
.
.
<div class="typ_show_txt" id="showtext01" style="margin-top: 275px; display:inline">3&nbsp;Zimmer<br>120,65qm&nbsp;Wfl.<br>46,48qm&nbsp;Nfl.<br>Keller<br>Ausbaureserve</div>
<div class="typ_show_txt" id="showtext02" style="margin-top: 275px; display:none">4&nbsp;Zimmer<br>100,65qm&nbsp;Wfl.<br>66,48qm&nbsp;Nfl.<br>Keller<br>Ausbaureserve</div>
.
.
.

was passiert ist, dass lediglich der text aus dem tag 'showtext01' permanent angezeigt wird und die Bilder sich durchschalten lassen, aber es wird weder der Text gelöscht noch ein anderer 'showtext' eingeblendet.

Kann mir jemand helfen?

Danke im Voraus und Gruß, Stefan

 

[abla]

So ein ähnliches Problem hatte ich auch einmal.
Da das ein und ausblenden nicht immer richtig funktioniert hat habe ich zwei neue CSS Klassen angelegt.
show{}
hidd{display:none;}

Jetzt musst du anstatt
document.getElementById(blankid + i).style.display="none";
den Klassennamen ändern.
document.getElementById(blankid + i).className = "hidd";
oder
document.getElementById(blankid + i).className = "show";

dann geht es sicher!
Da du ja schon CSS Klassen verwendest musst du das mit deinen Klassen machen.

z.B.
typ_show_txt
typ_hidd_txt