PDA

Volledige versie bekijken : Drop it down in bestaande code

Mark0402
%Europe/Berlin %396 %2005, 09:30
Hallo iedereen...

Ik heb menutje gemaakt waarin de standaard dingen staan. Home, nieuws, contact.
Nu wil ik in die code een dropdown menu verwerken.
Dus ik ben gaan zoeken op htmldog om een code te vinden en warempel die vond ik ook.
Alleen krijg ik die absoluut niet samen met de bestaande code. Iemand enig idee waar het aan ligt????

Bestaande code:
<script>
'menu':{
toBlur:200,
toFocus:200,
Blur:{
color:'rgb(254,254,254)',
background:'rgb(0,0,0)',
border:'solid 1px rgb(44,74,115)'
},
Focus:{
color:'rgb(44,74,115)',
background:'rgb(0,0,0)',
border:'solid 1px rgb(254,254,254)'
}
}
}

</script>

<body id=main onLoad=init() onUnload=kill()>
<iframe id=gate name=gate src=home.html border=0 frameborder=no scrolling=no></iframe>
<div id=menu>
<a id=menu~1 href=home.html target=gate>Home</a>
<a id=menu~2 href=diensten.html target=gate>Diensten</a>
<a id=menu~3 href=support.html target=gate>Support</a>
<a id=menu~4 href=nieuws.html target=gate>Nieuws</a>
<a id=menu~5 href=contact.html target=gate>Contact</a>
</div>
</body>


dropdown code:

<style type="text/css">

body {
font-family: arial, helvetica, serif;
}

#nav, #nav ul { /* all lists */
padding: 0;
margin: 0;
list-style: none;
line-height: 1;
}

#nav a {
display: block;
width: 10em;
}

#nav li { /* first list items */
float: left;
width: 10em;
}

#nav li ul { /* second-level lists */
position: absolute;
background: #FFFFFF;
width: 10em;
left: -999em;
}

#nav li:hover ul, #nav li.sfhover ul {
left: auto;
}

#content {
clear: left;
color: #2C4A73;
}

</style>

<script type="text/javascript"><!--//--><![CDATA[//><!--

sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

//--><!]]></script>


<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>

<body background="styles/images/home.jpg">

<ul id="nav">

<li><a href="home.html">Home</a>

</li>

<li><a href="#">Diensten</a>
<ul>
<li><a href="domein.html">Domeinregistratie</a></li>
<li><a href="#">Hosting</a></li>
<li><a href="#">Web Servers</a></li>
<li><a href="#">Computer Reparaties</a></li>
</ul>
</li>

<li><a href="#">Support</a>
<ul>
<li><a href="#">Burrowing gobies</a></li>
<li><a href="#">Dartfishes</a></li>
<li><a href="#">Eellike gobies</a></li>
<li><a href="#">Gobies</a></li>
<li><a href="#">Loach gobies</a></li>
<li><a href="#">Odontobutidae</a></li>
<li><a href="#">Sandfishes</a></li>
<li><a href="#">Schindleriidae</a></li>
<li><a href="#">Sleepers</a></li>
<li><a href="#">Xenisthmidae</a></li>
</ul>
</li>

<li><a href="#">Nieuws</a>
<ul>
<li><a href="#">Climbing perches</a></li>
<li><a href="#">Labyrinthfishes</a></li>
<li><a href="#">Kissing gouramis</a></li>
<li><a href="#">Pike-heads</a></li>
<li><a href="#">Giant gouramis</a></li>
</ul>
</li>

</ul>

<div id="content">
<p></p>
<p></p>
</div>
</body>
</html>

Elke keer als ik de code probeer in te passen blijkt dat de menuitems onderelkaar komen te staan en dus niet het gewenste effect hebben. Ik hoor graag van jullie...
Mark0402
%Europe/Berlin %410 %2005, 09:51
YESSsss....

even gesurft en een nieuw menu gevonden zonder de fouten. Na wat gepuzzel was dus dit probleem verholpen..

voor geinteresseerden wil ik de complete code wel plaatsen.. Laat maar weten...
mknol
%Europe/Berlin %435 %2005, 10:26
gaarne!
wel even tussen [ html ] [ / html ] plaatsen aub.
Mark0402
%Europe/Berlin %791 %2005, 18:59
Ik heb het als bijlage geplaatst.
Je kunt er erg veel in veranderen en natuurlijk nog een hoop van jezelf in plaatsen.

Succes...