php - 单独显示/隐藏具有相同类名的 div

Question

我正在尝试一件非常简单的事情，隐藏/显示我的鼠标悬停在另一个元素上的信息 div。我的代码结构类似于:

<div class="divRow">
    <div class="divColumn">
        <div class="divInfo">Info</div><a href=""><img src="" /></a></div>
        <div class="divInfo">Info</div><a href=""><img src="" /></a></div>
        <div class="divInfo">Info</div><a href=""><img src="" /></a></div>
    </div>
</div>

图像已显示，并且应该有一个空白区域，我希望在其中显示 divInfo。

我使用以下 jQuery 代码来显示/隐藏:

$(function() {
      $('.divInfo').hide();
      $('.divColumn').hover( function() { $('.divInfo').toggle(); } );
});

当然，这可行，但一次显示/隐藏行中的所有 3 个 div。我希望能够分别显示隐藏每个...

这可以使用类吗？或者我必须为每个使用不同的唯一ID？

这里显示了我想要的功能，但我不知道该怎么做。 :)

http://www.therice-co.com

问候和感谢

Answer 1

实际上，您希望 div 始终存在，但当您不将它们悬停时，它们会以某种方式“不可见”。这很简单:

.divInfo:not(:hover){
    opacity: 0;
}

Fiddle