elementbyid wieder ausblenden, nach refresh aber immer noch anzeigen

  • Themenstarter Themenstarter starfoxfs
  • Beginndatum Beginndatum
S

starfoxfs

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: 
<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: 
onclick="document.getElementById('mitglieder').style.visibility='visible';">

Hierdurch:

HTML: 
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: 
<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 :-)
 
Javascript Menü nach refresh immernoch anzeigen

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: 
<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>
 
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.
 
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: 
<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>
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück