What I would like to have, is that once you have taken your mouse off the sub menu that it remains visible for a couple of second before disappearing.
I got it to work, but there's still an issues that I would fix. You can see an example here -> [url]http://tijmensmit.com/dev/jquery/ menu.html[/url] It will only work for the about item. If the active-subnav class is present on the ul for the sub nav you will see a nice pink border. The problem is that once you have taken your mouse off the subnav and quickly go back again, it still removes the class from the UL. You can hover over the ul all you want, but it won't put the class back on the ul, unless you actually hover over the li in the subnav. So why would hovering over the li in the subnav make jquery place the active-subnav class back on to the ul, while hovering over the ul itself without moving over the li's has no effect? The first line of code cleary says if you hover over the li.test, ul.second-nav, ul.second-nav li add the class. But the hovering over the ul.second-nav doesn't seem to have any effect? Or am I doing this completely the wrong way? [code] $(document).ready(function() { $('#navigatie li.test, ul.second-nav, ul.second-nav li').hover (function() { $('ul.second-nav').addClass('active-subnav'); }, function() { var elem = $('ul.second-nav'); setTimeout( function() { $(elem).removeClass("active-subnav"); }, 3000); }); }); [/code]