1

* SOLVED *

jQuery - unbind or rebind hoverIntent()?

I hope I got the topic name right.

I'm using HoverIntent for a simple horizontal navigation menu. Hover "Item One" > .second-navigation becomes visible. However, if the user is already on that "Item" in the relevant .second-navigation, obviously I wan't that one to be visible at all times. As it stands now, it is visible on when the page loads, but the HoverIntent is triggered if the user use the navigation in any way, leaving the current navigation to slide up again.

I have a feeling I should've done this another way around but if there's a fix to my problem I'd greatly appreciate it.

Markup for it:

<ul class="main-navigation">
    <li>Item One
        <ul class="second-navigation">
            <li>Item</li>
        </ul>
    </li>
    <li>Item Two
        <ul class="second-navigation">
            <li>Item</li>
        </ul>
    </li>
    <li>Item Three
        <ul class="second-navigation">
            <li>Item</li>
        </ul>
    </li>
</ul>

jQuery

$(document).ready(function() {
    $('.main-navigation > li:has("ul")').hoverIntent(   
        function(){
            $(this).find('ul').slideDown(300);
            $(this).find('ul li').fadeIn(100);
        },
        function(){
            $(this).find('ul li').fadeOut(100);
            $(this).find('ul').slideUp(300);
        }
    );
...
Community
  • 1
  • 1
Dennis
  • 47
  • 1
  • 8

0 Answers0