Ebene ein- bzw. ausblenden

[Susan]

Hi,

ich habe mir den Blank Page MOD installiert. Jetzt bin ich dabei bzw. möchte ich eine Zutatenliste erstellen. Diese soll so aussehen:

Menüleiste zb: Zutat 1 | Zutat 2 | Zutat 3 usw.
Darunter werden dann Tabellen erstellt die sichtbar werden wenn man auf den jeweiligen Link darüber klickt.

Ich habe im Internet dazu folgendes Script gefunden:

Code: Alles auswählen

<script language="JavaScript" type="text/javascript">
<!--
function einblenden(div) {
  with(document.getElementById(div).style){
    if(display=="none"){
      display="inline";
    }
    else{
      display="none";
    }
  }
}
//-->
</script>


<a href="#" onClick="einblenden('ebene1'); return false;"> Ein-/Ausblenden 1 </a> | <a href="#" onClick="einblenden('ebene2'); return false;"> Ein-/Ausblenden 2 </a>
<div id="ebene1" style="display:none;"><br><br><br>
  Bildtext Bildtext Bildtext Bildtext<br>
  Bildtext Bildtext Bildtext Bildtext<br>
  Bildtext Bildtext Bildtext Bildtext<br>
  Bildtext Bildtext Bildtext Bildtext<br>
  Bildtext Bildtext Bildtext Bildtext<br>
  Bildtext Bildtext Bildtext Bildtext<br>
</div> 
<div id="ebene2" style="display:none;"><br><br><br>
  Bildtext Bildtext Bildtext Bildtext<br>
  Bildtext Bildtext Bildtext Bildtext<br>
  Bildtext Bildtext Bildtext Bildtext<br>
  Bildtext Bildtext Bildtext Bildtext<br>
  Bildtext Bildtext Bildtext Bildtext<br>
  Bildtext Bildtext Bildtext Bildtext<br>
</div> 

Es funktioniert sehr gut, jedoch muß man immer wieder auf den Link klicken um die Tabellen ein- bzw aus zu blenden.

Ich bräuchte es aber so das wenn man den nächsten Link anklickt der erste Text durch den aktuellen ersetzt wird. Also automatisches ausblenden der Tabellen die nicht gebraucht werden.

Gibt es hier jemanden der mir helfen kann? Ich bin im Programmieren nicht die Beste und im Internet hab ich auch nicht wirklich was gefunden

Dankeschön
Susan

[oxpus]

Ändere das Script mal in

Code: Alles auswählen

<script language="JavaScript" type="text/javascript">
<!--
function einblenden(div) {
  with(document.getElementById(div).style){
   if(display == 'none'){
     display = '';
    } else {
      display = 'none';
    }

   if(div == 'ebene1') {
    ebene = getElementById('ebene2');
   } else {
    ebene = getElementById('ebene1');
   }
    ebene.style.display = 'none';
  }
}
//-->
</script>

Geht aber auch nur, wenn max. nur die beiden Ebenen vorhanden sind!

[Susan]

Moin oxpus,

wenn es nur mit den beiden Ebenen geht dann kann ich das nicht nehmen. Es werden einige benötigt. Wieviele kann ich nicht sagen, aber im moment sind es schon ca 15 und das wird sicher noch um einiges mehr.

[oxpus]

Ich weiß jetzt nicht, wie mal die Anzeige aller Bereiche auf einmal ausblendet, sonst hätte ich eine Lösung.
Ansonsten nur alle Ebenen abfragen und wie in meinem Beispiel die Bedingungen erweitern...