我想知道是否可以选择三个项目,当它们没有悬停时,所有这些项目的不透明度都是1,而另一个项目的另外两个项目的不透明度是一半,或者“淡化” “,当我将鼠标悬停在一个上面时。
这是我到目前为止所尝试的,不幸的是,它已被证明是不成功的,因为我悬停在上面的物体的不透明度仍为.5。
#mainLinks:hover { opacity: .5; }
#mainLinks a{
margin: 10px -10px 10px -10px;
-webkit-transition: -webkit-transform .1s;
}
#mainLinks a:hover{
-webkit-transform: scale(1.1);
opacity: 1.5;
}
感谢任何和所有帮助!请问我是否需要更多信息或澄清!
谢谢, 欧文
答案 0 :(得分:2)
你快到了。
示例HTML:
<ol id="items">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
</ol>
CSS:
#items:hover > li { opacity: .5; }
#items:hover > li:hover { opacity: 1; }
我从你的例子中省略了转换/转换,但我认为你明白了。
<强> JSFiddle 强>