Scroll menu - hjælp
Hej jeg vil gerne lave scroll menu til nedenstående menu- har prøvet at lave et css men det virker ikke - kan kan måske indbygge det i selve siden?
Mvh Jette
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title></title>
<style type="text/css">
* { margin: 0; padding: 0; }
body { margin: 20px; }
/* fjern list bullets */
#menu {
list-style-type: none;
}
#menu ul{
list-style-type: none;
}
/* da li normalt vises som 'block' skal de floates for at komme på samme linie */
#menu li {
background: #ffffff;
color: #666666;
padding: 5px;
width: 150px;
border-top: 1px inset;
float: center;
}
#menu li:hover {
background-color: #ececec;
color: #00a400;
}
/* class til menuitems med undermenu - relativ position
for at kunne bruge absolut position til undermenuerne */
#menu .sub {
position: relative;
background: url(subitems.JPG) right center no-repeat;
color: #666666;
}
#menu .sub:hover {
background-color: #ececec;
color: #00a400;
}
/* Funktionalitet */
/* skjul underlister by default */
.sub > ul {
display: none;
}
/* Gældende for første niveau, foldud nedad, når ".sub:hover" triggeres,
forskydelse på 100% af højden. Position i forhold til left bruges for
at undermenuer kan positiones i forhold til venstre
*tip*: (hvis forskydelse mod venstre er ønsket, skift left værdierne til right værdier) */
.sub:hover > ul {
display: block;
position: absolute center;
top: 100%;
left: 15px;
}
/* fra 2. niveau og videre, skal det gå mod højre, forskudt 100% af bredden */
.sub:hover .sub:hover > ul {
top: 0px;
left: 100%;
}
</style>
<link rel="stylesheet" type="text/css" href="scrolbar_menu.css">
</head>
<body>
<font size="10px">
<!-- Menu HTML -->
</font>
<ul id="menu">
<li class="sub">
<p align="left"><font size="2">Byggeregler
</font></li>
<li class="sub">
<p align="left"><font size="2">Formandsliste
</font>
</li>
<li class="sub">
<p align="left"><font size="2">Haveforeninger
</font>
</li>
<li class="sub">
<p align="left"><font size="2">Havevurdering
</font>
</li>
<li class="sub">
<p align="left"><font size="2">Kassererliste
</font>
</li>
<li class="sub">
<p align="left"><font size="2">Lejekontrakt
</font>
</li>
<li class="sub">
<p align="left"><font size="2">Udvalg
</font></li>
</ul>
<!-- Slut menu -->
<p> </p>
</body>
</html>
