Hallo miteinander.
Ich bin schon lange auf der Suche nach einem geeigneten Script für meine Homepage. Leider finde ich nur Menüs, welche mir nicht helfen.
Ich habe 3 <div>-Blöcke, welche ich verstecken möchte. Eine Leiste (wie Navigation) mit dem Text: Öffnen: DIV1 | DIV2 | DIV3 soll den bestimmten <div> öffnen.
So weit, so gut: Diese Funktion habe ich hier (Javascript: Text verbergen und anzeigen) gefunden.
Ich möchte jedoch auch, dass gleichzeitig nur 1 <div> offen sein kann. D.h. dass bei einem Klick auf öffnen die bereits aktiven geschlossen werden müssen.
Leider blicke ich bim verlinkten Beitrag nicht ganz durch.
Vielleicht ist es jemandem möglich, den Code so zu verändern, dass die <div> automatisch geschlossen werden.
Herzlichen Dank für eure Bemühungen und freundliche Grüsse
Hier der funktionierende Text ohne automatisches Schliessen:
Alles anzeigen
Ich bin schon lange auf der Suche nach einem geeigneten Script für meine Homepage. Leider finde ich nur Menüs, welche mir nicht helfen.
Ich habe 3 <div>-Blöcke, welche ich verstecken möchte. Eine Leiste (wie Navigation) mit dem Text: Öffnen: DIV1 | DIV2 | DIV3 soll den bestimmten <div> öffnen.
So weit, so gut: Diese Funktion habe ich hier (Javascript: Text verbergen und anzeigen) gefunden.
Ich möchte jedoch auch, dass gleichzeitig nur 1 <div> offen sein kann. D.h. dass bei einem Klick auf öffnen die bereits aktiven geschlossen werden müssen.
Leider blicke ich bim verlinkten Beitrag nicht ganz durch.
Vielleicht ist es jemandem möglich, den Code so zu verändern, dass die <div> automatisch geschlossen werden.
Herzlichen Dank für eure Bemühungen und freundliche Grüsse
Hier der funktionierende Text ohne automatisches Schliessen:
Quellcode
- <script type="text/javascript">
- function show (member) {
- if (document.getElementById) {
- if (document.getElementById(member).style.display == "block") {
- document.getElementById(member).style.display = "none";
- } else {
- document.getElementById(member).style.display = "block";
- }
- }
- }
- </script>
- </head><body>
- <a href="javascript:show('B')">B anzeigen</a><br>
- <table id="B" style="display:none">
- <tr><td>B's Details</td></tr>
- </table>
- <a href="javascript:show('C')">C anzeigen</a><br>
- <table id="C" style="display:none">
- <tr><td>C's Details</td></tr>
- </table>
- <a href="javascript:show('A')">A anzeigen</a><br>
- <table id="A" style="display:none">
- <tr><td>A's Details</td></tr>
- </table>