Drop down menu og selectboxe "driller"
Hej jeg anvender følgende dropdown menu, det hele fungerer fint bortset fra at dropdown "DIV'erne" gemmer sig bagved selectboxe i mine forme. Er der mon nogen der har en løsning på dette problem?menu og css er herunder
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Nyt dokument</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<!--
Drop down menu by Jimmy Thomsen - http://www.powerzone.dk
Copyright Jimmy Thomsen - do not remove this note.
-->
<script type="text/javascript">
function showmenu(elmnt, obj) {
document.getElementById(elmnt).style.visibility="visible";
}
function hidemenu(elmnt) {
document.getElementById(elmnt).style.visibility="hidden";
}
</script>
<div class="topmenu">
<div class="menuitemcontainer" onmouseover="showmenu('boern', this)" onmouseout="hidemenu('boern')">
<a class="menuitemlink" href="#">overskrift1</a>
<div class="submenu" id="boern" onmouseover="showmenu('forside')" onmouseout="hidemenu('forside')">
<a href="#" class="submenu">1</a>
<a href="#" class="submenu">2</a>
<a href="#" class="submenu">3</a>
</div>
</div>
<div class="menuitemcontainer" onmouseover="showmenu('morogfar', this)" onmouseout="hidemenu('morogfar')">
<a class="menuitemlink" href="#">overskrift 2</a>
<div class="submenu" id="morogfar" onmouseover="showmenu('info')" onmouseout="hidemenu('info')">
<a href="#" class="submenu">1</a>
<a href="#" class="submenu">2</a>
</div>
</div>
<div class="menuitemcontainer">
<a class="menuitemlink" href="#">uden sub</a>
</div>
<div class="menuitemcontainer" onmouseover="showmenu('stillinger')" onmouseout="hidemenu('stillinger')">
<a class="menuitemlink" href="#">overskrift 3</a>
<div class="submenu" id="stillinger" onmouseover="showmenu('kontakt')" onmouseout="hidemenu('kontakt')">
<a href="#" class="submenu">1</a>
<a href="#" class="submenu">1</a>
<a href="#" class="submenu">1</a>
</div>
</div>
</div>
<br>
Tekst tekst tekst tekst tekst Tekst tekst tekst tekst tekst Tekst tekst tekst tekst tekst
</body>
</html>
Placer dette i style.css
body {
font-family: Verdana, Arial;
font-size: 11px;
color: #000000;
}
div.topmenu {
border: 0px solid #808080;
width: 750px;
height: 21px;
/*background: url(../images/menu.jpeg) repeat-x;*/
background-color: #5A6994;
}
div.menuitemcontainer {
float: left;
}
a.menuitemlink {
padding-top: 3px;
padding-right: 10px;
padding-bottom: 5px;
padding-left: 5px;
color: #FFFFFF;
text-decoration: none;
display: block;
}
a.menuitemlink:hover {
/*background: url(../images/menuhover.jpeg) repeat-x;*/
background-color: #E79114;
}
div.submenu {
width: 150px;
position: absolute;
z-index: 1;
visibility: hidden;
border: 1px solid #808080;
background-color: #5A6994;
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=90);
-moz-opacity: 0.90;
opacity: 0.90;
}
a.submenu {
width: 135px;
padding: 2px 10px 3px 5px;
color: #FFFFFF;
text-decoration: none;
display: block;
}
a.submenu:hover {
width: 135px;
/*background: url(../images/menuhover.jpeg) repeat-x;*/
background-color: #E79114;
}
mvh gf
