Menu klapper sammen
Hej eksperter!Jeg har lavet menuen med nedenstående kode, men når jeg klikker på et af de to link under "om siu" så kommer den kaldte side fint frem, men menuen nulstiller. Dvs. klapper sammen igen.
Hvordan får jeg lavet så menuen ikke klapper sammen før man klikker på et nyt punkt i den?
Et andet spørgsmål:
Hvordan laver jeg koden, så man kun kan have et overordnet menupunkt åbent ad gangen? Nu kan alle åbnes samtidigt. Det fylder jeg rimeligt meget!
<html>
<head>
<title>menu_siu</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
function showMnu(id) {
var styleCheck = document.getElementById("mnu" + id).style.display;
//alert(styleCheck);
if (styleCheck == "inline") {
document.getElementById("mnu" + id).style.display = "none";
}
if (styleCheck == "none") {
document.getElementById("mnu" + id).style.display = "inline";
}
}
</script>
<style type="text/css">
<!--
a.menu { font-family: verdana,arial,sans-serif;
height: 10px;
font-size: 10pt;
color: #ffffff;
background: #C00024;
width: 100%;
text-decoration: none;
padding: 1px }
a:menu:hover { font-family: verdana,arial,sans-serif;
color: #000000;
font-size: 10pt;
background: #C00024;
text-decoration : none;
border-left: 10px solid #ffffff;
}
a:menu:active { font-family: verdana,arial,sans-serif;
color: #000000;
font-size: 10pt;
text-decoration : none;
font-weight: bold;
}
-->
</style>
</head>
<body bgcolor="#C00024" background="../layout/menu_baggrund_siu.gif" bgproperties="fixed">
<table width="175" border="0" align="right">
<tr>
<td><div style='cursor:hand; cursor:pointer; font-family:verdana,arial,sans-serif; font-size:10px;' OnClick='showMnu(1);'>
<a href="#" class='menu'>om siu</a></div>
<div style='cursor:hand; cursor:pointer; font-family:verdana,arial,sans-serif; font-size:8px; display:none;' id='mnu1'>
<a href="/page500.aspx" class='menu' onmouseover="window.status='';return true" onmouseout="window.status='';return true"> - link1</a><br>
<a href="/page513.aspx" class='menu' onmouseover="window.status='';return true" onmouseout="window.status='';return true"> - link2</a></div>
</td>
</tr>
<tr>
<td><div style='cursor:hand; cursor:pointer; font-family:verdana,arial,sans-serif; font-size:10px;' OnClick='showMnu(2);'><a href="#" class='menu'>generel info</a></div>
<div style='cursor:hand; cursor:pointer; font-family:verdana,arial,sans-serif; font-size:8px; display:none;' id='mnu2'><a href="#" class='menu'> - link1</a><br><a href="#" class='menu'> - link2</a></div>
</td>
</tr>
<tr>
<td><div style='cursor:hand; cursor:pointer; font-family:verdana,arial,sans-serif; font-size:10px;' OnClick='showMnu(3);'><a href="#" class='menu'>studiemuligheder</a></div>
<div style='cursor:hand; cursor:pointer; font-family:verdana,arial,sans-serif; font-size:8px; display:none;' id='mnu3'><a href="#" class='menu'> - link1</a><br><a href="#" class='menu'> - link1</a></div>
</td>
</tr>
<tr>
<td><div style='cursor:hand; cursor:pointer; font-family:verdana,arial,sans-serif; font-size:10px;' OnClick='showMnu(4);'><a href="#" class='menu'>spørgsmål og svar</a></div>
<div style='cursor:hand; cursor:pointer; font-family:verdana,arial,sans-serif; font-size:8px; display:none;' id='mnu4'><a href="#" class='menu'> - link1</a><br><a href="#" class='menu'> - link1</a></div>
</td>
</tr>
<tr>
<td><div style='cursor:hand; cursor:pointer; font-family:verdana,arial,sans-serif; font-size:10px;' OnClick='showMnu(5);'><a href="#" class='menu'>chat</a></div>
<div style='cursor:hand; cursor:pointer; font-family:verdana,arial,sans-serif; font-size:8px; display:none;' id='mnu5'><a href="#" class='menu'> - link1</a><br><a href="#" class='menu'> - link1</a></div>
</td>
</tr>
<tr>
<td><div style='cursor:hand; cursor:pointer; font-family:verdana,arial,sans-serif; font-size:10px;' OnClick='showMnu(6);'><a href="#" class='menu'>kontakt</a></div>
<div style='cursor:hand; cursor:pointer; font-family:verdana,arial,sans-serif; font-size:8px; display:none;' id='mnu6'><a href="#" class='menu'> - link1</a><br><a href="#" class='menu'> - link1</a></div>
</td>
</tr>
</table>
</body>
</html>
