Posted By

bcalloway on 11/22/08


Tagged

javascript navigation jquery drop-down


Versions (?)

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


jQuery drop-down navigation


 / Published in: JavaScript
 

Simply jQuery script for CSS drop-down menu

  1. $(document).ready(function() {
  2. //Main nav drop-downs
  3. $('#header ul li').each(function() {
  4. $(this).mouseover(function() {
  5. $(this).children('ul').css("display", "block");
  6. });
  7. $(this).mouseout(function() {
  8. $(this).children('ul').css("display", "none");
  9. });
  10. });
  11. });

Report this snippet  

Comments

RSS Icon 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

You need to login to post a comment.