0
$(function () {
$(".menu2").hide();
$(".open").stop(true, true).mouseover(function() {
$(".menu2").fadeIn(100).animate({ top: '-50' }, 400);
});
$(".open").mouseleave(function() {
$(".menu2").stop(true, true).fadeTo('fast').animate({ top: '1' }, 100).hide();
})
});#conteudo{
width:100%;
height:300px;
background:#36C;
}
.menu{
width:1365px;
height:30px;
background:#F00;
margin:0px auto;
}
.menu1{
width:450px;
height:30px;
background:#FFF;
}
.menu1 li{
width:150px;
height:30px;
background:#FF0;
list-style:none;
float:left;
}
.menu2{
width:150px;
height:90px;
background:;
margin-top:50px;
position:relative;
display:block;
}
.menu2 li{
width:150px;
height:30px;
background:#C30;
top:20px;
position:relative;
}
.menu2 li:hover{
width:150px;
height:30px;
background:#C60;
top:20px;
position:relative;
}
menu1 li ul li .open{
widht:150px;
height:500px;
background:#096;
position:absolute;
display:block;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="conteudo">
<nav class="menu">
<ul class="menu1">
<li>Teste1</li>
<li class="open">Teste2
<ul class="menu2">
<li>Sub-Teste1</li>
<li>Sub-Teste2</li>
</ul>
</li>
<li>Teste3</li>
</ul>
</nav>
</div>Good night guys, all right?
I’m looking for a way to make the dropdown menu, the operation of this menu is exactly as the link below:
http://cssmenumaker.com/menu/textured-responsive-drop-down-menu.
I would like when the cursor is on top of the link, the submenu has the effect of appearing, as the link example.
Enter the code of what you tried, even if you’re wrong.
– Renan Gomes
This link of yours is from a menu code generator you want. Below the example is a link to download a zip with all the code needed to generate this menu. That’s what you want?
– bfavaretto
First thank you for the prompt reply @bfavaretto. That’s right, I need to know how to do this menu, I analyzed the source code that is available for download, but I was a little confused, there is a simpler way to do this menu?
– Israel
Hello @Reynan, all right? As the final result was not close to what I expected, I thought it best not to put it here, because I believe I’m doing it wrong! But if you prefer I can put it, what do you think?
– Israel
Yes Israel, enter the code. But try to isolate the problem, and show only the parts that are not working. Take a look on this help page.
– bfavaretto
Israel, that comment directed to the bfavaretto can be made in the comments.
– user28595
Good night @bfavaretto, I did the menu and so far it worked, the problem I’m having now is that when I pass the cursor many times and at a high speed in the movement of put and take it on top of the button that has the effect mouseover() it hangs. I put the example of the code I did above my question.
– Israel