jQuery dropdown is really jumpy
- by Matthew Westrik
Hi, I'm making a dropdown menu with jquery (some of the code is borrowed from a tutorial by someone, although I forget who...). When I use the dropdown, it slides up and down really fast, and I can't figure it out. What do you think?
HTML
<div id="nav">
<ul class="topnav">
<li><a class="selected" href="#" title="home">home</a></li>
<li><a href="events/" title="events calendar">events</a></li>
<li><a href="photos/" title="photo gallery">photos</a></li>
<li><a href="staff/" title="faculty">staff</a>
<ul class="subnav">
<li><a href="#">Luke</a></li>
<li><a href="#">Darth Vader</a></li>
<li><a href="#">Princess Leia</a></li>
<li><a href="#">Jabba the Hutt</a></li>
</ul>
</li>
<li><a href="contact/" title="contact">contact</a></li>
jQuery
$(document).ready(function(){
$("ul.subnav").parent() .hover(function() {
$(this).parent().find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on hover...
$(this).parent() .hover(function() {
}, function(){
$(this).parent().find("ul.subnav").slideUp('slow');
});
$(this).parent().find("ul.subnav") .hover(function() {
}, function(){
$(this).parent().find("ul.subnav").slideUp('slow');
});
}).hover(function() {
$(this).addClass("subhover");
}, function(){
$(this).removeClass("subhover");
});