mit JavaScript css-Boxen ein und ausblenden
Posted: 16. Mar 2008 18:10
Ich möchte mit CSS und JavaScript ein Menu erstellen, bei dem Duch Klicken auf einen der Links sich eine Box öffnet und die vorhandene Box an gleicher Stelle ersetzt.
Bisher muss man die Boxen einzeln aus- und einblenden.
Wie muss die Funktion verändert werden, damit bei einem Klick gleichzeitig die eine Box ausgeblendet und die neue eingeblendet wird?
(vom Prinzip her wie hier: http://validator.w3.org/)
Bisher muss man die Boxen einzeln aus- und einblenden.
Wie muss die Funktion verändert werden, damit bei einem Klick gleichzeitig die eine Box ausgeblendet und die neue eingeblendet wird?
(vom Prinzip her wie hier: http://validator.w3.org/)
Code: Select all
.links1
{
...
display:block;
}
.links2
{
...
display:none;
}
<script type="text/javascript">
function ShowHide(id){
obj = document.getElementsByTagName("div");
if (obj[id].style.display == 'block'){obj[id].style.display = 'none';}
else {obj[id].style.display = 'block';}
}
</script>
<a href="javascript:ShowHide2('links1', 'links2')">links1 | </a>
<a href="javascript:ShowHide2('links2')">links2</a>
<div class="links1" id="links1">
<a href="#link1">link1</a><br clear="all">
<a href="#link1">link1</a><br clear="all">
</div>
<div class="links2" id="links2">
<a href="#link2">link2</a><br clear="all">
<a href="#link2">link2</a><br clear="all">
</div>