javascript - jquery 如果鼠标悬停

Question

我有一个带有悬停功能的 img 来显示元素。这个新元素中的一些与 img 重叠，所以如果我将鼠标悬停在新元素上，因为光标不再位于 img 上，元素会隐藏自身然后立即重新出现，因为光标再次位于 img 上。如果光标位于新元素内的 img 上(新元素与主图像重叠的唯一部分)，我需要以某种方式忽略 mouseout 命令。

解释起来很棘手，但这是代码:

jquery(我不知道该怎么做)

$("div > img").hover( function() {

        $(this).parent().find("span").slideDown(100);

    }, function() {

        if (user is hovering over the span) {
                    // do nothing
        } else {
            $(this).parent().find("span").slideUp(100);
        }
    });

html

<div>
    <img src="/images/icons/dm.jpg" width="54" height="54" />
    <span><strong>Test</strong><br />test2<img src="/images/arrow.png" width="19" height="17" /></span>
</div>

Answer 1

一个更简单的方法就是使用 .hover() 在那个 parent 身上<div>像这样:

$("div").hover(function() {
    $(this).find("span").slideDown(100);
}, function() {
    $(this).find("span").slideUp(100);
});

因为您实际上只想影响 <span>当鼠标悬停在 <div> 上时(其中只有 <img> 最初是可见的)...将您的处理程序放在那里更有意义，您会看到代码变得多么简单 :) 我只给出 <div>您可以在选择器中使用一些类(以使其更具体)，一切就绪。