当鼠标悬停时向上滑动 div 并在鼠标移开时隐藏，但有一些规则

Question

我有 1 个名为 #init_ind 的 div 和另一个名为 #footer_init_ind 的 div。 #footer_init_ind 的 css 代码标记为visible:none; 我有一个名为 showfooter 的函数：

    function showfoot( itemImg ) {

        if ($(itemImg).is(":hidden")) {
            $(itemImg).slideDown("slow");
        } else {
            $(itemImg).hide();
        }
};

当鼠标进入或离开幻灯片时，我还有一些幻灯片 #footer_init_ind 事件。

$('#init_ind').mouseenter(function(){
        showfoot('#pie_init_ind');
});

$('#init_ind').mouseleave(function(){
        $('#pie_init_ind').css("height","17px");
        $('#pie_init_ind').hide();
    });

$('#pie_init_ind').mouseenter(function(){
        $('.pie_init_txt').css("cursor", "default");
        $('#pie_init_ind').css("height","50px");
    });
    $('#pie_init_ind').mouseleave(function(){
        $('.pie_init_txt').css("cursor", "default");
        $('#pie_init_ind').css("height","17px");
        $('#pie_init_ind').hide();
    });

我的问题是，当鼠标输入 #pie_init_ind 并将其保留在 #init_ind 中再次输入时， #pie_init_ind 不会按照我想要的方式将其大小减小到 17px。但当鼠标离开 #pie_init_ind 进入 #init_ind 之外的另一个 div 时，它会起作用。

请问我该怎么办？？？ 谢谢

Answer 1

很难确定，因为我看不到定义这些 div 的 HTML，但如果您的某些 div 是嵌套的，您会看到您描述的问题。例如...

<div a>
    <div b></div>
</div>
<div c></div>

如果将鼠标悬停在 div b 上应增加 div c 的高度，但将鼠标悬停在 div a 上应减少 div c 的高度 - 默认情况下，将鼠标悬停在 b 上将触发 a 和 b 的两个事件（即减小和增加尺寸） c) 部分。

如果您提供相关页面的链接，我会查看标记。有时，这些问题只需要一双新的眼睛。