Stop hover with navigation to just display links

Question

I'm somewhat new to developing with SharePoint, so sorry if this is painfully obvious and I'm totally missing something.

I have a publishing site that I'm working on, and I need to tweak the navigation on it. So far the heading links work well, but I want its sublinks to just appear right under each heading looking like they're child links to each heading. No hover or anything to make them appear, they'll already be appearing by default. Here's a screenshot of what I currently have:

Disregard the unimplemented CSS that needs to be done. Currently, "ABC 101" and "ABC 123" show up when I mouse-over "Teaching" or the space below it. Once I leave either that mouse-over space or the "ABC 101"/"ABC 123" links, it'll go away. Same thing happens with "Research". What I would like to do is make it so that the links show up all the time (don't rely on a hover to make them appear) and to move them over so they're in the navigation area. Here is the jQuery code that I'm unsuccessfully using:

(function($) {
    var timer;
    $(document).ready(function() {
        $('li.static.dynamic-children').unbind('mouseover').unbind('mouseout')
        .hover(function () {
            var li = $(this);
            li.css({'position': 'relative', 'z-index': '100'}).find('ul.dynamic').css({'left': '-1px', 'top': '25px'});
        }, function() {
            var li = $(this);
            //li.css({'position': 'static', 'z-index': 'auto'})
            //.find('ul.dynamic').css({'left': '-999em'});
        });
    });
}(jQuery));

Can anyone give me a hand as to what I'm doing wrong?

Answer 1

Try $(".menu [hoverDebouncer]").removeAttr("hoverDebouncer") instead of the unbinds

$(document).ready(function() {
    $(".menu [hoverDebouncer]").removeAttr("hoverDebouncer")
    .hover(function () {
        var li = $(this);
        li.css({'position': 'relative', 'z-index': '100'}).find('ul.dynamic').css({'left': '-1px', 'top': '25px'});
    }, function() {
        var li = $(this);
        //li.css({'position': 'static', 'z-index': 'auto'})
        //.find('ul.dynamic').css({'left': '-999em'});
    });
});