Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I would like to extend the pure CSS dropdown menu of the standard twentyten theme in order to accomodate a small delay on hiding the submenu onmouseout.

Is there any way we could do this using jQuery? I've seen some solutions using hoverIntent:

These do not seem to work for me. I have multiple levels of navigation, and the solutions above display all sublevels of the navigation at once (without the delay onmouseout).

Could anyone please help me out? Does a plugin maybe exist for this sort of thing?

Thanks in advance

share|improve this question
    
This is a CSS/jQuery question, not a WordPress question. –  Chip Bennett Oct 31 '11 at 14:29
add comment

1 Answer

The solution was very simple! Just use Superfish.js as instructed on http://users.tpg.com.au/j_birch/plugins/superfish/#getting-started

Be sure to include superfish, hoverIntent and jQuery in your wordpress. In your custom js script file, something like this works like a charm:

$('ul#theidofyourmenu').superfish({
  delay:         600,   // This will fire up the hoverIntent
  autoArrows:    false  // Disable this if you don't want arrows on toplevel nav links
}); 

Thanks to @pixeline for his hint on using Superfish.js

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.