Javascript 当我使用jquery将鼠标悬停在图像上时，如何使跨度保持不变？

我有这样的代码，当我把鼠标悬停在图像上时可以工作，但当我把鼠标悬停在跨度上时，它会返回到不透明度0。跨度是否也不会出现在第一个图像中

    $(document).ready(function() {
        var $img = $('.carousel-inner li img'),
            $text = $('.carousel-inner li span');

            $img.hover(function() {
                $text.stop().animate({
                    opacity: 1,
                    height: '75px'
                }, 500);
                },function() {
                    $text.stop().animate({
                    opacity: 0,
                    height: '0px'
                }, 500);
            });
    });

您可以查看一个示例

我让它工作了。 而不是

var$img=$（'.carousel-inner-li-img'），

我把

我从变量中删除了

img

，因此当我将鼠标悬停在整个

li

上时，我的函数工作了，而不是仅仅将鼠标悬停在

img

上

---

但是我仍然无法让

span

出现在第一幅图像中？

您应该这样处理这两幅图像的包装：

    $(document).ready(function() {
        var $img = $('.carousel-inner li img'),
            $text = $('.carousel-inner li span');

            $img.hover(function() {
                $text.stop().animate({
                    opacity: 1,
                    height: '75px'
                }, 500);
                },function() {
                    $text.stop().animate({
                    opacity: 0,
                    height: '0px'
                }, 500);
            });
    });

$('.carousel-inner li').on('mouseenter',function() {
     //show text
});
$('.carousel-inner li').on('mouseleave',function() {
     //hide text
});

---

我认为您应该在

（容器）上使用

$.hover（）

函数，而不仅仅是

---

您可以在此处看到效果：

鼠标移出图像时不要隐藏它。显然，您希望将其隐藏，因此更好的解决方案是将光标向上移动到li而不是img。您可能希望

$（“span”，this）

而不是

$text

@KevinB该代码适用于除第一个图像之外的所有其他图像。悬停时，跨度与所有图像一起显示没有问题，只是第一个图像上没有显示。这可能是我的carousel.js文件吗？我想这可能是任何东西。我没有访问过你的实时演示，因为我只访问了JSFIDLE、jsbin、codepen或pastebin上的演示。如果你还想看的话，我创建了这个演示？它似乎对我有用，我在4幅图像中看到了正确的跨度。是的，我现在发现我的问题是，由于一些奇怪的原因，跨度没有出现在第一幅图像上。如果你想看的话就做这个。

var $li = $('.carousel-inner li')

...

$li.hover(function() { ... }