Fernando Sousa Postado Novembro 6, 2011 Denunciar Share Postado Novembro 6, 2011 Olá.Eu estou tentando criar um menu que :*ao passar o mouse sobre um menu o submenu aparece em baixo deslizando.*e ao tirar o mouse de cima ocorra um efeito contrario(óbvio!).<!---------- C Ó D I G O---F O N T E --------------> <html> <head> <script> var i=0 var move=45 var timer var menu=null function movedown() { menu=document.getElementById("menu") menu.style.position="relative" menu.style.display="block" if (i<=move) { menu.style.display="block" menu.style.top=i i++ } timer=setTimeout("movedown()",10) } function moveup() { menu=document.getElementById("menu") menu.style.position="relative" menu.style.display="block" if (i>=move) { menu.style.top=i i--} timer=setTimeout("moveup()",10) } </script> <style id="estilo"> span{ border:1px solid blue; float:left; position:relative; z-index:1; height:250px;} #menu-d{ border-radius:5px; width:200px; height:40px; background:#990000; } p{ text-decoration:none; border-radius:5px; width :96px; height:150px; border:1px solid blue; float:left; } #menu{ position:relative; z-index:2; display:block; } #var{display:block;} </style> </head> <body> <br/> <br/> <div id="menu-d"> <span onmouseover="movedown()" id="span" onmouseout="moveup()">Passe o mouse aqui <p id="menu">menu <a href="#">submenu1</a> <a href="#">submenu2</a> <a href="#">submenu3</a> <a href="#">submenu4</a> <a href="#">submenu5</a> </p></span> </body> </html> <!---------F I M ------------------------>Quando o mouse passa por cima ( onmouseover ) é executada a função movedown() que empurra o menu para baixo. Quando o mouse sai (onmouseout) é executada a função moveup() que faz o contrario (empurra o submenu para cima).Porém a função mousedown() continua sendo executada, o que faz com que haja conflito(a caixa pode ficar tremendo...).Como resolver este problema? Citar Link para o comentário Compartilhar em outros sites More sharing options...
Pergunta
Fernando Sousa
Olá.
Eu estou tentando criar um menu que :
*ao passar o mouse sobre um menu o submenu aparece em baixo deslizando.
*e ao tirar o mouse de cima ocorra um efeito contrario(óbvio!).
<!---------- C Ó D I G O---F O N T E --------------> <html> <head> <script> var i=0 var move=45 var timer var menu=null function movedown() { menu=document.getElementById("menu") menu.style.position="relative" menu.style.display="block" if (i<=move) { menu.style.display="block" menu.style.top=i i++ } timer=setTimeout("movedown()",10) } function moveup() { menu=document.getElementById("menu") menu.style.position="relative" menu.style.display="block" if (i>=move) { menu.style.top=i i--} timer=setTimeout("moveup()",10) } </script> <style id="estilo"> span{ border:1px solid blue; float:left; position:relative; z-index:1; height:250px;} #menu-d{ border-radius:5px; width:200px; height:40px; background:#990000; } p{ text-decoration:none; border-radius:5px; width :96px; height:150px; border:1px solid blue; float:left; } #menu{ position:relative; z-index:2; display:block; } #var{display:block;} </style> </head> <body> <br/> <br/> <div id="menu-d"> <span onmouseover="movedown()" id="span" onmouseout="moveup()">Passe o mouse aqui <p id="menu">menu <a href="#">submenu1</a> <a href="#">submenu2</a> <a href="#">submenu3</a> <a href="#">submenu4</a> <a href="#">submenu5</a> </p></span> </body> </html> <!---------F I M ------------------------>Quando o mouse passa por cima ( onmouseover ) é executada a função movedown() que empurra o
menu para baixo. Quando o mouse sai (onmouseout) é executada a função moveup() que faz o contrario (empurra o submenu para cima).
Porém a função mousedown() continua sendo executada, o que faz com que haja conflito(a caixa pode ficar tremendo...).Como resolver este problema?
Link para o comentário
Compartilhar em outros sites
0 respostass a esta questão
Posts Recomendados
Participe da discussão
Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.