Hello guys! im new and i want to see if someone can help me.
Im making a dropdown menu with divs hidden, the thing is, when the mouse is over a button the id changes so the background becames white and the text blue, and the hidden div appears with it's content, we are fine until here, but my issue begins when i move the mouse over the new div, the button returns to it's original id, and i want it to remain in the "hover" id.
Here is the code:
CSS:
#cergen a:link{display:inline-block;height:20px;float: right;text-align:center;padding: 2px 5px 0 5px;margin: 0 0 0 10px;text-decoration: none;font-size:12px;color:#FFF;}
#cergen a:visited{display:inline-block;height:20px;float: right;text-align:center;padding: 2px 5px 0 5px;margin: 0 0 0 10px;text-decoration: none;font-size:12px;color:#FFF;}
#cergen a:hover{display:inline-block;height:20px;float: right;text-align:center;padding: 2px 5px 0 5px;margin: 0 0 0 10px;text-decoration: none;font-size:12px;color:#0059C4;background-color:#FFF;}
#cergen a:active{display:inline-block;height:20px;float: right;text-align:center;padding: 2px 5px 0 5px;margin: 0 0 0 10px;text-decoration: none;font-size:12px;color:#0059C4;background-color:#FFF;}
#div1 {
position:absolute;
width:150;
visibility:hidden;
margin-left: 90px;
}
JAVA:
function toggleDiv(id,flagit) {
if (flagit=="1"){
if (document.layers) document.layers[''+id+''].visibility = "show"
else if (document.all) document.all[''+id+''].style.visibility = "visible"
else if (document.getElementById) document.getElementById(''+id+'').style.visibility = "visible"
}
else
if (flagit=="0"){
if (document.layers) document.layers[''+id+''].visibility = "hide"
else if (document.all) document.all[''+id+''].style.visibility = "hidden"
else if (document.getElementById) document.getElementById(''+id+'').style.visibility = "hidden"
}
}
HTML:
<div id="cergen"><a href="#" onmouseover="toggleDiv('div1',1)" onmouseout="toggleDiv('div1',0)">Cergen</a></div>
<div align="center" id="div1" onmouseout="this.style.visibility='hidden'" onMouseOver="this.style.visibility='visible'">
<div id="sub-menu-contenedor">
fede<br/>
fede<br/>
fede<br/>
fede<br/>
</div>
</div>