Hej
Jeg har kopieret et script fra en side... www.webdesign101.dk
Dropdownmenuen virker fint nok, men jeg vil gerne have menuerne til at glide ud til højre, istedet for nedad... i kan se menuen på www.bjerglundpedersen.dk/emil/larshp
koden er:
<html>
<head>
<title>Venstre</title>
<style type="text/css">
body { background: silver; }
</style>
</head>
<body><!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" xml:lang="da" lang="da">
<head>
<title>Webdesign 101 Demoside</title>
<meta name="robots" content="all" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<style type="text/css" media="screen">
<!--
div#menubox {
position:absolute;
top:20px;
left:7px;
}
.topmenu {
position:absolute;
z-index:99;
}
.submenu {
position:absolute;
z-index:99;
display:none;
}
#topmenu1{
left:10px;
top:10px;
}
#topmenu2{
left:10px;
top:40px;
}
#topmenu3{
left:10px;
top:70px;
}
#topmenu4{
left:10px;
top:100px;
}
#topmenu5{
left:10px;
top:130px;
}
a.knap {
z-index:99;
background-color: #900;
color:#fff;
display: block;
font: normal bold 12px arial, helvetica, sans-serif;
text-align: left;
text-decoration: none;
margin-bottom:1px;
border:2px outset #d00;
border-top-color:#ff6600;
border-left-color:#ff6600;
border-right-color:#990000;
border-bottom-color:#990000;
padding: 2px 12px 2px 12px;
width:130px;
height:22px;
}
html>body .knap {
width:102px;
height:14px;
}
.knap:hover {
background-color: #cc0000;
color: #fff;
text-decoration: none;
border-style: inset;
border-top-color:#990000;
border-left-color:#990000;
border-right-color:#ff6600;
border-bottom-color:#ff6600;
}
-->
</style>
<script type="text/javascript">
<!--
function collapseObjekt(objekt){
var blok = document.getElementById(objekt).style;
blok.display="none"
}
function expand(objekt,onoff){
skjulAlle();
var blok = document.getElementById(objekt).style;
if (onoff==true)
blok.display=(onoff) ? "block" : "none"
}
function skjulAlle(){
for (nr=1;nr<6;nr++)
collapseObjekt('menu'+nr)
}
//-->
</script>
</head>
<body>
<div id="menubox">
<div class="topmenu" onmouseover="expand('menu1',true)" onmouseout="skjulAlle()" id="topmenu1"><a class="knap" href="blank.php">Generelt</a>
<div class="submenu" id="menu1">
<div><a class="knap" href="blank.php">Introduktion</a></div>
<div><a class="knap" href="blank.php">Om foreningen</a></div>
<div><a class="knap" href="blank.php">Om astronomien</a></div>
</div>
</div>
<br>
<div class="topmenu" onmouseover="expand('menu2',true)" onmouseout="skjulAlle()" id="topmenu2"><a class="knap" href="javascript:void(null)">Indre planeter</a>
<div class="submenu" id="menu2">
<div><a class="knap" href="blank.php">Merkur</a></div>
<div><a class="knap" href="blank.php">Venus</a></div>
<div><a class="knap" href="blank.php">Jorden</a></div>
<div><a class="knap" href="blank.php">Mars</a></div>
</div>
</div>
<br>
<div class="topmenu" onmouseover="expand('menu3',true)" onmouseout="skjulAlle()" id="topmenu3"><a class="knap" href="javascript:void(null)">Asteroiderne</a>
<div class="submenu" id="menu3">
<div><a class="knap" href="blank.php">Generelt</a></div>
<div><a class="knap" href="blank.php">Retrograde</a></div>
<div><a class="knap" href="blank.php">Jordnære</a></div>
</div>
</div>
<br>
<div class="topmenu" onmouseover="expand('menu4',true)" onmouseout="skjulAlle()" id="topmenu4"><a class="knap" href="javascript:void(null)">Ydre planeter</a>
<div class="submenu" id="menu4">
<div><a class="knap" href="blank.php">Jupiter</a></div>
<div><a class="knap" href="blank.php">Saturn</a></div>
<div><a class="knap" href="blank.php">Uranus</a></div>
<div><a class="knap" href="blank.php">Neptun</a></div>
<div><a class="knap" href="blank.php">Pluto</a></div>
</div>
</div>
<br>
<div class="topmenu" onmouseover="expand('menu5',true)" onmouseout="skjulAlle()" id="topmenu5"><a class="knap" href="javascript:void(null)">Kometskyen</a>
<div class="submenu" id="menu5">
<div><a class="knap" href="blank.php">Solnære kometer</a></div>
<div><a class="knap" href="blank.php">Oort-skyen</a></div>
<div><a class="knap" href="blank.php">Udstrækning</a></div>
<div><a class="knap" href="blank.php">Masse</a></div>
</div>
</div>
<br>
</div>
</body>
</html>
</body>
</html>
//Emilbp
-| I am just... Me!! |-