• code snippets
  • all code snippets/
  • popular code snippets/
  • your code snippets
• extras
• blog
• about snipplr

• Big /
• Small

Posted By

bcalloway on 11/22/08

Tagged

javascript navigation jquery drop-down

Versions (?)

11/22/08 07:47pm

Who likes this?

13 people have marked this snippet as a favorite

benrudolph
jamesming
luman
sulfurito
dsquare
bryandease
sachinbhavsar
Hollow
loric
seanpowell
dekehooper
aegony
wirenaught

 / Published in: JavaScript

 

$(document).ready(function() {
//Main nav drop-downs
  $('#header ul li').each(function() {
    $(this).mouseover(function() {
      $(this).children('ul').css("display", "block");
    });
    $(this).mouseout(function() {
      $(this).children('ul').css("display", "none");
    });
  });
});

Report this snippet   Tweet

Comments

Subscribe to comments

Posted By: gabiton on October 5, 2010

It would be even better if you use slideDown and slideUp instead of .css:

$(document).ready(function() { //Main nav drop-downs $('#header ul li').each(function() { $(this).mouseover(function() { $(this).children('ul').stop().slideDown(); }); $(this).mouseout(function() { $(this).children('ul').stop().slideUp(); }); }); });

The stop() is to prevent troubles when hovering in and out too fast