当悬停图像，0.5不透明度为链接的图像和不透明度为工具栏提示

我想链接的行为时处于悬停状态时，链接将有0.5的不透明度，则提示会出现，但与不透明度为1.

正如您在照片上看到的那样，当处于悬停状态时，链接和工具提示的不透明度均为0.5。

我尝试添加此：

.tooltip-text:hover{opacity: 1;}

我的猜测是，也许.img_links的不透明度，因为他们是锚标记元素的一个元素压倒一切的不透明度与.tooltip文本所做的任何更改？

任何帮助将不胜感激。谢谢。

你可以在这里粘贴相关的代码，而不是在屏幕截图中显示它？ stacksnippet是首选。 –

你可以创建一个你的问题的jsfiddle吗？ –

由于工具提示是.img_links的孩子，如果您降低.img_links的不透明度，工具提示永远不会比它的父级更加不透明。

更换

.img_links:hover { opacity: .5 }

与

.img_links img:hover { opacity: .5 }

或移动提示出img_links容器。

2016-02-28 08:55:55 Tdelang

这也工作。谢谢。 – AMHProgrammer

您可以使用下面的CSS：

.img_links:hover > img { 
    opacity: 0.5; 
}

更换：

.img_links:hover .tooptip-text { 
    visibility: visible; 
    opacity: 1; 
} 

.img_links:hover { 
    opacity: 0.5; 
}

当你的鼠标在图像或工具提示上，图像仍然是0.5不透明性与无影响提示。希望这可以帮助你;）

2016-02-28 09:03:22

但.tooltip文本将不可见，因为它被声明为隐藏。我尝试了您的代码，但未替换.img_links：hover .tooptip-text { visibility：visible; 不透明度：1; }它工作。谢谢。 – AMHProgrammer

哦，我不知道你之前隐藏了tooltip-text：p很高兴你已经解决了这个问题！ –

回答