Question

我想要它，当你将鼠标悬停在两个图像中的任何一个上时，它会触发相应的<figcaption>。我有它，所以当你将鼠标悬停在两个图像中的任何一个上时，它只会隐藏第一个图像。我对jQuery并不擅长，但我很肯定有一种方法可以做到这一点。

Answer 1

使用$(this).find('figcaption')获取当前悬停的figcaption，

试试这个

$(document).ready(function () {
    $('#q-omega').on('click', function () {
        $('#search-bar').fadeToggle(400);
    });
    $('figure').mouseover(function () {
        $(this).find('figcaption').slideUp(200);
    }).mouseleave(function () {
        $(this).find('figcaption').slideDown(200);
    });
});

DEMO

Answer 2

首先：元素的ID必须是唯一的，因此请使用类/元素选择器对它们进行分组

所以

<figcaption class="caption">

然后

$('figure').mouseover(function () {
    $(this).find('.caption').slideUp(200);
}).mouseleave(function () {
    $(this).find('.caption').slideDown(200);
});

演示：Fiddle

Answer 3

我必须是唯一的。

试试这个：

    $('img').mouseover(function(){
       $(this).next().slideUp(200);
    }).mouseleave(function(){
       $(this).next().slideDown(200);
    });

演示：http://jsfiddle.net/AmitJoki/gxQkQ/4/

为什么jQuery鼠标悬停不起作用？

3 个答案: