CSS类不起作用

Question

我已经设置了一堆 div，当您将鼠标悬停在父 div 上时，我试图交换子 div 上的类。现在我正在尝试用 jQuery 来做，但我也很乐意使用伪类。

悬停不起作用，我认为这是因为样式被列为内联，但是当我从内联中删除样式并将其作为一个类执行时，整个 div 就会消失。它假设是一个 3d 堆栈，因此它只是一个具有白色背景和不透明度集的 div。

---

div是：

<div id = "3dstack_4" class = "3dstack_4_nohover"></div>

...我将课程列为：

.3dstack_4_nohover {
    border:0px solid red;
    -webkit-transform: translate3d(1px, 14px, 0px);
    position:absolute;
    z-index:12;
    height:34px;
    width:46px;
    background-color:#ffffff;
    opacity:.3;
}

---

这是 jsFiddle：http://jsfiddle.net/7EH7X/4/。感谢您对此的任何想法。

Answer 1

我会使用 CSS 来做到这一点。这是一个非常简单的例子：

HTML

<div id="container">
    <div>A</div>
    <div>B</div>
</div>​

CSS

#container > div {
    display: none
}
#container > div:first-child {
    display: block
}
#container:hover > div {
    display: block
}​

然后随着您的进展添加其他详细信息。这是DEMO

祝你好运。