• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

3 Klappfenster :/

D

djfabi

Mitglied
Hallo html.de Gemeinde,

Ich möchte es so machen (Überschrift) das 3 klappfenster die aus 3 button, und 3 <div>s bestehen (visibility: hidden;) und wenn ich auf button 1 Klicke soll Div 1 ausfahren.

Das gleiche auch bei Fenster 2 und 3.

SO ABER JZ KOMMTS:

Es soll wenn 1 'ausgefahren' ist und man auf 2 klickt soll 2 ausfahren und 1 ein.

So das immer nur eins offen sein kann.

Wenn ich dann auf das offene klicke soll es sich noch schliessen.

Für facebook USer: So wie die Button im header; also Freundschaftsanfragen ; Chats ; Benachrichtigungen;

Ich hoffe ihr könnt mir weiter helfen!

Danke im Vorraus!

Grüße djfabi
 
Mein bisheriger Versuch bestandt nur aus 3 Spoilern, welche sich ausfahren liesen, und abhängig voneinander wahren, also
wenn ich 1 offen hatte, auf 2 gedrückt hab ist 1 eingefahren.

Aber ich habe es nicht hinbekommen, das es wenn man auf das Objekt drückt, einfährt.

Hier mal der Code:

HTML: 
<script>var layerArray= new Array();layerArray[0]="erster";layerArray[1]="zweiter";layerArray[2]="dritter";
function show(ID){  if(document.getElementById)  {
   for(var i=0; i<layerArray.length; i++)   {       if(layerArray[i]==ID)       {
                document.getElementById(ID).style.visibility = "visible";       }       else       {
             document.getElementById(layerArray[i]).style.visibility = "hidden";       }     }  }

  }

</script>

</head><body>

<p><a href="javascript:show('erster')" id="eins">1</a></p><div id="erster" class="tbox" style="visibility:hidden">Erster Text!

</div>


<p><a href="javascript:show('zweiter')" id="zwei">Bild posten</a></p><div id="zweiter" class="tbox" style="visibility:hidden">
Zweiter Text!
</div>
<p><a href="javascript:show('dritter')" id="drei">Datenbank</a></p><div id="dritter" class="tbox" style="visibility:hidden">
Dritter Text!</div>







So das ist der. Sry wg den wahrscheinlich nicht vorhandenen Umbrüchen, in meinem Quellcode ist das auch nicht so, auch hab ich das hier MIT Umbrüchen kopiert, aber es wird immer geändert... -.-



Naja bitte helft mir ich seh den Wald vor lauter Bäumen nicht.... *Verzweifelt tuend* ....

Danke im Vorraus :)
 
Du müsstest dafür nur deine Bedingung anpassen. Von

Code: 
if(layerArray[i]==ID)
{
 document.getElementById(ID).style.visibility = "visible";
}
else
{
 document.getElementById(layerArray[i]).style.visibility = "hidden";
}

zu

Code: 
if(layerArray[i]==ID && document.getElementById(ID).style.visibility == "hidden")
{
 document.getElementById(ID).style.visibility = "visible";
}
else
{
 document.getElementById(layerArray[i]).style.visibility = "hidden";
}
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben