Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Ola pessoal, to com um probleminha.
Estou querendo fazer um menu horizontal que ao passar o mouse por cima da opção, aparece embaixo os submenus.
Ate ai eu consegui fazer, mas acontece que nao sei como manter esse sub aberto ao tirar o ponteiro de cima do menu principal e coloca-lo encima dos sub's
Segue abaixo o codigo que fiz, esta completo, não ha nenhum arquivo aparte.
<html>
<head>
<style type="text/css" title="mystyles" media="all">
.nav {
width:500px;
font-family:arial, verdana, sans-serif;
}
a{
text-decoration:none;
}
</style>
<script type="text/javascript">
function abrefecha(id){
target = document.getElementById(id);
if(target.style.display == "none"){
target.style.display = "block";
}
else if(target.style.display == "block"){
target.style.display = "none";
}
}
</script>
</head>
<body>
<table class="nav">
<tr align="center">
<td>
<a href="#"><b>Amostra</b></a>
</td>
<td>
<a href="#" OnMouseOver="javaScript:abrefecha('a1')" OnMouseOut="javaScript:abrefecha('a1')"><b>Amostra Menu 1</b></a>
</td>
<td>
<a href="#" OnMouseOver="javaScript:abrefecha('a2')" OnMouseOut="javaScript:abrefecha('a2')"><b>Amostra Menu 2</b></a>
</td>
</tr>
</table>
<div style="display: none;" id="a1">
<table class="nav">
<tr align="center">
<td>
<a href="#">Amostra Menu 1</a>
</td>
<td>
<a href="#">Amostra Menu 1</a>
</td>
<td>
<a href="#">Amostra Menu 1</a>
</td>
</tr>
</table>
</div>
<div style="display: none;" id="a2">
<table class="nav">
<tr align="center">
<td>
<a href="#">Amostra Menu 2</a>
</td>
<td>
<a href="#">Amostra Menu 2</a>
</td>
<td>
<a href="#">Amostra Menu 2</a>
</td>
</tr>
</table>
</div>
</body>
</html>
Se alquem souber, me ajude, e se ainda souber como fazer para não dar erro no IE, agradeço, mtu msm!
VLW, VLW!
Carregando comentários...