Question

我正在为我的兄弟开发一个网站（那些不是他的照片，他们是随机的）： http://dev.denisduvauchelle.com/eric/2012/

当我将jquery动画中的div移动到页面顶部时，我遇到了一个问题，浏览器仍然认为光标在div上方制作了另一个动画，不应该这样做。

以下是重新创建它的步骤： 1.加载页面 2.单击徽标 3.稍微移动鼠标 ----＆GT;你会看到菜单下拉并快速备份

一旦用户鼠标悬停在徽标周围的白框上，就会发生该动画。所以我猜测浏览器仍然认为鼠标在盒子上并制作动画，我能找到什么样的解决方案呢？

谢谢，如果我不清楚，请告诉我。

以下是用户点击徽标时的代码：

    $('#logo').live('click',function(){ 
        var attr = $(this).attr('title'); 
        if(attr === "Enter"){ 
            stop_fullscreen_flicker();
            $('#header_first').fadeOut(speedNormal);
            $("header").delay(500).animate({
                "top" : spacing_header+'px'
            }, 'slow').css("backgroundColor","#FFF");
            $(this).attr('title','');
            $("#header_work").delay(1000).slideToggle('fast', function(){
                // Load the first project
                var first_loaded_project = $('#first_loaded_project').val();
                $('#link_'+first_loaded_project).addClass('external');
                $('#link_'+first_loaded_project).trigger('click');
            });
        } else {
            set_href('about');
            $("#content").fadeOut('fast',function(){
                $("#header_work ul").slideUp('fast');
                $('#backstretch').hide();
                $("#about").fadeIn('fast');
                $("#about").addClass('on');
                set_href('about');
            });
        }
        return false;
    });

以下是鼠标悬停的代码：

    $('#header_work h1').live('mouseenter',function(){
        $("#header_work ul").slideDown('fast');
    });

    $('header').live('mouseenter',function(){
        $('#header_work h1').addClass('h1active');
        var attr = $('#logo').attr('title'); 
        if(attr !== "Enter"){ 
            $("#header_work ul").slideDown('fast');
            var img_src = "a_img/take-a-chance.jpg";
            $('#backstretch').hide();
            $.backstretch(img_src);
            $('#content').hide();
            $('#backstretch').show();
        }
    });

感谢Sheikh Heera，您可以尝试一下这个问题： http://jsfiddle.net/kRs7Q/10/

Answer 1

Does this help？

$('header').on('hover', function(){
    $("#header_work ul").slideToggle('fast');
},function(){
    $("#header_work ul").slideToggle('fast');
});

Jquery div移动浏览器仍然认为鼠标已经结束

1 个答案: