MySQL interesse |
|
ik heb een navigatie menu met CSS en javascript
Wanneer ik over mijn "button" ga kan ik submenu's verkrijgen en die staan dan in een ander kleur qua achtergrond. maar wanneer ik weg ga van mijn menu, verdwijnt ook die achtergrond... Weet iemand een oplossing hoe ik die achtergrond vast zou kunnen houden. (dus ook zichtbaar als ik niet op mijn menu sta...)
hieronder zal ik ff mijn code posten...
<html>
<head>
<title>Horizontaal menu</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#menuitems {
background:#56568F;
width:"100%"px;
height:16px;
font-family:Verdana;
font-size:80%;
font-weight:normal;
}
a.menu {
background:#8484DB;
color:blue;
}
a:hover.menu {
background:#8484DB;
color:red;
}
</style>
<script type="text/javascript">
var submenu=new Array()
submenu[0]=''
submenu[1]='<a href="#">Algemeen<\/a> <a href="#">Werking<\/a>'
submenu[2]=''
submenu[3]=''
submenu[4]='<a href="#">Geschiedenis<\/a> <a href="#">Palmares<\/a> <a href="#">internationaal<\/a>'
submenu[5]='<a href="#">Foto\'s<\/a> <a href="#">Audio<\/a> <a href="#">Naslag<\/a>'
submenu[6]=''
submenu[7]=''
function toon(teller) {
document.getElementById('menuitems').style.visibility="visible"
document.getElementById('menuitems').innerHTML=submenu[teller]}
function hide() {
document.getElementById('menuitems').style.visibility="hidden"}
function show() {
document.getElementById('menuitems').style.visibility="visible"}
</script>
</head>
<body bgcolor="#8484DB">
<a class="menu" href="home.html" target="mainFrame" onMouseover="toon(0)">Home</a>
<a class="menu" href="#" target="mainFrame" onMouseover="toon(1)">Orkest</a>
<a class="menu" href="#" target="mainFrame" onMouseover="toon(2)">Dirigent</a>
<a class="menu" href="#" target="mainFrame" onMouseover="toon(3)">Agenda</a>
<a class="menu" href="#" target="mainFrame" onMouseover="toon(4)">Historiek</a>
<a class="menu" href="#" target="mainFrame" onMouseover="toon(5)">Media</a>
<a class="menu" href="#" target="mainFrame" onMouseover="toon(6)">Contact</a>
<a class="menu" href="#" target="mainFrame" onMouseover="toon(7)">Links</a><br>
<div id="menuitems" onmouseout="hide()" onmouseover="show()"></div>
</body>
</html>
<html> <head> <title>Horizontaal menu</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> #menuitems { background:#56568F; width:"100%"px; height:16px; font-family:Verdana; font-size:80%; font-weight:normal; } a.menu { background:#8484DB; color:blue; } a:hover.menu { background:#8484DB; color:red; } </style> <script type="text/javascript"> submenu[0]='' submenu[1]='<a href="#">Algemeen<\/a> <a href="#">Werking<\/a>' submenu[2]='' submenu[3]='' submenu[4]='<a href="#">Geschiedenis<\/a> <a href="#">Palmares<\/a> <a href="#">internationaal<\/a>' submenu[5]='<a href="#">Foto\'s<\/a> <a href="#">Audio<\/a> <a href="#">Naslag<\/a>' submenu[6]='' submenu[7]='' function toon(teller) { document.getElementById('menuitems').style.visibility="visible" document.getElementById('menuitems').innerHTML=submenu[teller]} function hide() { document.getElementById('menuitems').style.visibility="hidden"} function show() { document.getElementById('menuitems').style.visibility="visible"} </script> </head> <body bgcolor="#8484DB"> <a class="menu" href="home.html" target="mainFrame" onMouseover="toon(0)">Home</a> <a class="menu" href="#" target="mainFrame" onMouseover="toon(1)">Orkest</a> <a class="menu" href="#" target="mainFrame" onMouseover="toon(2)">Dirigent</a> <a class="menu" href="#" target="mainFrame" onMouseover="toon(3)">Agenda</a> <a class="menu" href="#" target="mainFrame" onMouseover="toon(4)">Historiek</a> <a class="menu" href="#" target="mainFrame" onMouseover="toon(5)">Media</a> <a class="menu" href="#" target="mainFrame" onMouseover="toon(6)">Contact</a> <a class="menu" href="#" target="mainFrame" onMouseover="toon(7)">Links</a><br> <div id="menuitems" onmouseout="hide()" onmouseover="show()"></div> </body> </html>
TIA
Dieter
|