1

我尝试将鼠标悬停在上，.logo然后.nav_b滑动向下/向上滑动，如果鼠标继续移动，.nav_b那么它仍然可见。

这些代码工作正常，但是当鼠标从 .logo 移动到.nav_b它时会触发语句.logo mouseout。
如何设置标志或..调用鼠标从moveout或不？有什么建议吗？谢谢！.logo.nav_b

http://jsfiddle.net/6URAb/

$('.logo').hover(function(){
    $('.nav_b').stop(true, true).slideDown({duration: 200, queue: false});
},function(){
    $('.nav_b').stop(true, true).slideUp({duration: 200, queue: false});
});

$('.nav_b').hover(function(){
    $('.nav_b').stop(true, true).show();
},function(){
    $('.nav_b').stop(true, true).slideUp({duration: 200, queue: false});
});
4

1 回答 1

1

最简单的方法是更改​​您的标记并将悬停事件附加到.head元素 Javascript

$(function () {

    $('.head').hover(function () {
        $('.nav_b').stop(true, true).slideDown({
            duration: 200,
            queue: false
        });
    }, function () {
        $('.nav_b').stop(true, true).slideUp({
            duration: 200,
            queue: false
        });
    });
});

HTML

<div class="head">
    <div class="logo">logo</div>
    <div class="nav_b">
        <div class="search">search</div>
    </div>
</div>

检查小提琴

编辑

如果您想使用相同的 marup 来实现它，那么您将需要使用setTimeout和cleartimeout的组合。像这样的东西

$(function () {
    var TIME_OUT;
    $('.logo').hover(function () {
        if (TIME_OUT) clearTimeout(TIME_OUT);
        $('.nav_b').stop(true, true).slideDown({
            duration: 200,
            queue: false
        });
    }, function () {
        $('.nav_b').stop(true, true).slideUp({
            duration: 200,
            queue: false
        });
    });

    $('.nav_b').hover(function () {
        $('.nav_b').stop(true, true).show();
    }, function () {
        TIME_OUT = setTimeout(function () {
            $('.nav_b').stop(true, true).slideUp({
                duration: 200,
                queue: false
            });
        }, 250);
    });
});

更新小提琴

于 2013-06-01T23:02:41.767 回答