html - webkit浏览器上的悬停问题

Question

我在修复 webkit 浏览器上的 CSS 悬停问题时遇到了麻烦。代码有点像这样..

#working .info{
    cursor: pointer;
    width: 19px;
    height: 21px;
    opacity: 0.5;
    position: absolute;
}
#working .info:hover {
    opacity: 1;
}

#working .info:hover + .infoTip, {
    filter: alpha(opacity=100);
    opacity: 100;
}

问题仅在于 webkit 浏览器。

Answer 1

你最后有一个逗号.infoTip可能会破坏它，并且 opacity: 100 不正确，试试这个。

#working .info:hover + .infoTip {
    filter: alpha(opacity=100);
    opacity: 1;
}

OP 更新后编辑：

Chrome 在渲染 opacity: 0 时以某种方式出现错误。但是如果你使用 display: none; 它将起作用。反而。

.infoTip{
  display: none;
}

#working .info:hover + .infoTip{
  display: block;
}

Answer 2

试试这个 CSS

enter code here
    #working .info{
    cursor: pointer;
    width: 19px;
    height: 21px;
    opacity: 0.5;
    position: absolute;
    filter: alpha(opacity=50);
}
#working .info:hover
{
    opacity: 1;
}

#working .info:hover + .infoTip, {
    filter: alpha(opacity=100);
    opacity: 1;
}