0

我有点坚持这个。这是我的设置的基本概述：

<div id="shell">
  <div class="subelement">One</div>
  <div class="subelement">One</div>
  <div class="subelement">One</div>
  <div class="subelement">One</div>
</div>

我希望在 .subelement 悬停时降低具有子元素类的剩余 div 的不透明度。我知道如何在 jQuery 中使用悬停效果，只是不知道在为未悬停的剩余 div 设置动画时从哪里开始。感谢任何人的建议。

更新：最终解决方案 - http://jsfiddle.net/yqPFH/

4

4 回答 4

4

我会改用 CSS

演示

带动画的演示

HTML

<div id="shell">
  <div class="subelement">One</div>
  <div class="subelement">One</div>
  <div class="subelement">One</div>
  <div class="subelement">One</div>
</div>

CSS

#shell:hover {
    color: rgba(0,0,0,.5);
}

.subelement:hover {
    color: rgba(0,0,0,1);
}
于 2013-01-01T19:32:21.643 回答
1 
$("#shell .subelement").hover(function() {
    $(this).css("opacity", 1).siblings().css("opacity", 0.6);
});

http://jsfiddle.net/EV833/1

于 2013-01-01T19:31:52.640 回答
1

虽然这个问题已经有了答案，但提供了一个额外的答案，我对其进行了调整并已被删除。这里它使用 jQuery，当没有悬停时会失去悬停状态。简单的。

http://jsfiddle.net/kKHt4/3/

$(".subelement").hover( function() {
    $(this).siblings().stop().fadeTo("fast", 0.5);
}, function() {
    $(this).siblings().stop().fadeTo("fast", 1.0);
});​​​​​
于 2013-01-01T19:58:22.497 回答
0

两部分问题：

1）你如何只保留第一行不透明度：1 并休息在 0.5 2）一旦选择或悬停，你如何保持不透明度：1，直到你悬停/选择另一行？

于 2016-06-02T00:02:42.303 回答