dúvida Hidden e onMouseOver

Folspa · Novembro 11, 2013

Pessoal, eu gostaria de saber como fazer um menu ficar contraído e descontrair apenas quando passar o mouse por cima.

Por exemplo, imagine essa barra de navegação do XTibia (que desce junto com a página) teria apenas um pedaço dela para fora, quando passar ou mouse, ela apareceria totalmente, deslizando para baixo.

Piabeta Kun · Novembro 12, 2013

tem tecnicas basicas para o mesmo efeito por exemplo o gesior eu ja simulei o feito dos botoes do menu apenas criando dois botoes um contraido e um exposto e colocando no lugar dos originais que usavam o efeito de clariar quando passar o mouse!

mais pelo que eu lembro de epocas mega antigas de curso que esses efeitos sao criados mesmo com flash mais ai são outros 500, basta usar tecnicas basicas(gamibarras) para atingir o mesmo efeito!

Folspa · Novembro 12, 2013

Não po, eu sinto que isso é puro javascript, mas não sei como o fazer.

Skymagnum · Novembro 12, 2013

É mais fácil por CSS, mas vê se isso ajuda http://maujor.com/tutorial/ddownmenu.php.

Folspa · Novembro 12, 2013

Não é isso, estou falando disso:

Menu normal:

Menu quando passa o mouse por cima:

Skymagnum · Novembro 12, 2013

<html>
<head>
 
<style type="text/css">
 
#menu{
width:630px;
height:12px;
background-color:#000000;
}
 
.itemOn{
width:630px;
height:22px;
padding-left:10px;
background-color:#000000;
}
.itemOn a{color:#fff; text-decoration:none; font-size:16px; font-weight:bold;}
.itemOn a:hover{text-decoration:none; font-size:16px; font-weight:bold;}
 
.itemOver{
width:150px;
height:22px;
padding-left:10px;
background-image: url(bg-menu.gif);
}
.itemOver a{color:#000000; text-decoration:none; font-size:2px; font-weight:bold;}
.itemOver a:hover{text-decoration:none; font-size:16px; font-weight:bold;}
 
</style>
 
<script language="JavaScript">
 
function mouse_out_menu(objDiv)
{
objDiv.className = 'itemOver';
}
 
function mouse_over_menu(objDiv)
{
objDiv.className = 'itemOn';
}
 
</script>
 
</head>
<body>
<div id="menu">
<div class="itemOn" onmouseover="mouse_over_menu(this);" onmouseout="mouse_out_menu(this);">
<a href="index.html">Menu</a></div>
</div>
</body>
</html>

Editado Novembro 12, 2013 por Skymagnum

Folspa · Novembro 14, 2013

Tem alguns bugs, mas o que está pegando mais é que quando o menu abre, ele empurra a página para baixo, ao invés de apenas aparecer.

Me disseram para usar o animate do jQuery.

Skymagnum · Novembro 15, 2013

Tem alguns bugs, mas o que está pegando mais é que quando o menu abre, ele empurra a página para baixo, ao invés de apenas aparecer.

Me disseram para usar o animate do jQuery.

Talvez pode funcionar, é que eu não sei quase nada de html hueuheuhe, pesquisei mo tempo pra faze sabagaça ae.

Alexclusive · Novembro 15, 2013

Se não me engano, isso se chama Dropdown.

Não po, eu sinto que isso é puro javascript, mas não sei como o fazer.

Tente falar com o NicolasFrancaX, ele faz parte de nossa equipe e é fera em JS.

Furabio · Abril 8, 2015

Tópico movido para sua devida área.

Lumus · Setembro 18, 2015

Tópico Movido
Este tópico foi movido de "OFF-Topic → Linguagens de Programação → Suporte Linguagens"
para "OFF-Topic → Linguagens de Programação → Suporte Linguagens → Dúvidas Resolvidas - Suporte Linguagens".

Entrar

dúvida Hidden e onMouseOver

Pergunta

Link para o comentário

Compartilhar em outros sites

10 respostass a esta questão

Posts Recomendados

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Quem Está Navegando 0 membros estão online