Hi zusammen,

Ich habe mir ein CSS Menü gebastelt was ich über jeweils einen Link aufrufe, funktioniert auch soweit super.
Mein Problem ist das das Menü nicht wieder ausgeblendet wird wenn ich einen anderen Link aufrufe.

HTML-Code:

<a href="#" id="show" onclick="document.getElementById('system').style.visibility='visible';"><img border="0" src="./images/systemL.png" id="sidebarimg" /><br /><br />System</a></div>
    <div class="sidebar">
    <a href="#" id="show" onclick="document.getElementById('mitglieder').style.visibility='visible';"><img border="0" src="./images/systemL.png" id="sidebarimg" /><br /><br />System</a></div></td>
    <td width="92%" id="inhalt">
    <table width="100%" border="0" height="40" align="center" cellspacing="0" cellpadding="0">
    <tr>
    <td background="./images/menuBar.png" align="left">
    <div class="menu">
 <div id="system" style="visibility:hidden;">
<ul>
<li><a href="#">System<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
	<ul>
	<li><a href="spies.html">System bla</a></li>
	</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>

</div>


 <div id="mitglieder" style="visibility:hidden;">
    
    <ul>
<li><a href="#">Mitglieder<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
	<ul>
	<li><a href="../menu/zero_dollars.html">Mitglieder1</a></li>
	<li><a href="../menu/embed.html">Mitglieder2</a></li>
	
	<li><a class="drop" href="../menu/hover_click.html">Mitglieder3<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
		<ul>
			<li><a href="../menu/form.html">test</a></li>
			<li><a href="../menu/nodots.html">test</a></li>
			<li><a href="../menu/hover_click.html">test</a></li>
		</ul>

<!--[if lte IE 6]></td></tr></table></a><![endif]-->
	</li>
	<li><a class="drop" href="../menu/shadow_boxing.html">test<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
		<ul>
			<li><a href="../menu/form.html">test</a></li>
			<li><a href="../menu/nodots.html">test</a></li>
			<li><a href="../menu/hover_click.html">test</a></li>

		</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
	</li>
		</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
    </div>
    </div>

Ersetzte folgendes:

HTML-Code:

onclick="document.getElementById('mitglieder').style.visibility='visible';">

Hierdurch:

HTML-Code:

onclick="obj = document.getElementById('mitglieder').style; obj.visibility =
obj.visibility=='visible' ? 'hidden' : 'visible';"

Und analog für die anderen onclicks.
Damit wird bei erneutem Clicken das Menü wieder ausgeblendet.

Ich hab schon eine bessere Lösung gefunden, hab bissi Google used

Dabei ist folgendes rausgekommen:

HTML-Code:

<script type="text/javascript">
function toggleswitch(id) 
{
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('div'+i)) {document.getElementById('div'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
</script>

 <div id="div1" style="display:none;" class="menu">
Hier Quelltext fürs Menü 1
</div>
 <div id="div2" style="display:none;" class="menu">
Hier Quelltext fürs Menü 2
</div>

Schaltet mir sauber durch die Menüs

Wenn du nur ein Menü suchst, dann ist das hier auch brauchbar:
http://christoph.ist-stylish.de/tut/listmenu.html
Einfach in den Quelltext schauen.

Hi zusammen,

Ich hab ein kleines Problem und zwar hab ich ein kleines Javascript was mir je nachdem verschiedene Div´s anzeigt. Nun möchte ich aber das der Div der gerade angeklickt wurde auch nach einem refresh der Seite aktiv bleibt.

HTML-Code:

<script type="text/javascript">
function toggleswitch(id) 
{
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('div'+i)) {document.getElementById('div'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
</script>

<a href="#" id="bgimage" onclick="toggleswitch('div1');"></a>
<a href="#" id="bgimage" onclick="toggleswitch('div2');"></a>

<a href="#" id="bgimage" onclick="toggleswitch('div3');"></a>


<div id="div1">Menü 1</div>
<div id="div2">Menü 2</div>
<div id="div3">Menü 3</div>

keiner ne Idee ?

und UP

Moin,

da müsstest du einen Cookie setzen, an dem du erkennst, was angeklickt wurde.

Mit Session ist das doch dann sicher auch möglich.

Gibts irgendwo ein Beispiel wie sowas aussieht kenne mich mit Javascript nicht sehr gut aus.

Dieses Tutorials beschreibt u.a. , wie soetwas gemacht werden kann:
http://www.tutorials.de/forum/php-tu...-im-board.html

So also ich habs nun doch mit Cookie gelöst da Session ja Serverseitig ist und da ich hier mit onclick keine Session setzen kann.

Nun mein Problem das ich noch habe wäre ein Javascript toggleswitch

Ich setze hier nun meinen Cookie auf den Div den ich haben will funktioniert auch aber wie gesagt das Javascript toggleswitch dafür fehlt

HTML-Code:

<a href="#" id="bgimage" onclick="document.cookie='menucookie=div1'"><img border="0" src="./images/icons/test.png" id="sidebarinnerimg" /><br /><br />Test</a></div>
<a href="#" id="bgimage" onclick="document.cookie='menucookie=div2'"><img border="0" src="./images/icons/test2.png" id="sidebarinnerimg" /><br /><br />Test2</a></div>

Etwas zum Thema toggleswitchtauschwechselschalterumkehr findest du hier:
http://www.tutorials.de/forum/javasc...ml#post1281443