鼠标移出Jquery,菜单隐藏不起作用

时间:2012-10-18 07:40:47

标签: jquery html css

我正在处理一个代码,当用户将鼠标悬停在标题(菜单)上时隐藏菜单将显示,并且如果用户未在隐藏菜单上访问(现在显示),则会在一定时间标题(菜单)之后隐藏表示不使用隐藏菜单(现在显示)..

http://jsbin.com/icobin/12

   $(document).ready(function(){

        $(function(){
            jQuery.fn.delay = function(millis,callBack){
                var object = $(this);
                $.extend(object,{callBack:callBack});
                return window.setTimeout(function() {
                    object.callBack();
                    return object;
                }, millis);
            };
        });

        var navFadeOutDelay = 500; // Set delay for drop down to slide down (in ms)

        // Navigation:
        var nav = {count:0};

        $(function(){
            $("#navigtion_wrap #navigation_top").hide(); //hide navigation on page load. 

            $('#nav_menu_text').bind('hover',function(){ 
                // On mouseenter, hide title and show navigation
 $("#navigtion_wrap #nav_menu_text").hide();
 $("#navigtion_wrap #navigation_top").fadeIn();

              nav.count += 1;
            }).bind('hoverend',function(){ // On mouseleave, fade out navigation and show title
                var tmp = nav.count;
                $("#navigtion_wrap #navigation_top").delay(navFadeOutDelay, function(){ 
                    // Delay: wait X ms before navigation FadeOut                

                    if (tmp == nav.count) { 
                        // prevent delay from firing if user hovers navigation before the end of delay
                        $(this).fadeOut('slow', function(){ //Callback                  
                            $("#navigtion_wrap #nav_menu_text").show(); 
                        }); 
                    }               
                });   
            });
        });
    });

1 个答案:

答案 0 :(得分:1)

 $('#navigtion_wrap #nav_menu_text').mouseover(function(){
    // on mouse over
    $(this).hide();
    $("#navigtion_wrap #navigation_top").fadeIn();
});

$('#navigtion_wrap #navigation_top').mouseleave(function(){
    // on mouse leave
    $(this).fadeOut();
    $("#navigtion_wrap #nav_menu_text").show();
});