Css 类似Facebook的弹出窗口具有反向不透明度设置（mouseover/mouseout）

我的类似facebook的按钮有一个奇怪的问题

通常，当你在一个网站上点击“喜欢”时，你会得到一个弹出的评论。此弹出窗口在鼠标悬停时不透明度为100%，但在鼠标悬停时不透明度降低

然而，在我的网站上，这是相反的。我在mouseout上获得100%的不透明度，在mouseover上降低不透明度。显然，这使得它很难使用

这是我的网站：。（要在其他页面上进行测试，请将&social=true添加到URL。）

---

非常感谢！这让我困惑了好几个星期。

我现在还不明白，但是，我建议的第一件事是将类似插件的fbml标签改为html5样式的标签。如果这不起作用，请尝试将like插件从results.html页面的复杂性中去掉，并放入一个包含最少html元素的页面中。如果这样做有效，那么您需要从results.html页面的基本版本开始，并开始一次添加html元素/块，直到插件中断。这将告诉您是什么HTML导致了类似插件的问题

来自

widget72.CSS

的CSS导致了交易：

.at300b:hover {
    opacity: 0.8;
}

您可以将CSS文件更改为：

.at300b:hover {
    opacity: 1;
}

只要您的CSS文件位于

widget72.CSS

之后（我假设您是热链接的），那么这应该可以解决问题。否则，您可以添加

！重要信息

输入CSS文件中的代码

编辑 如果您不悬停时希望子项具有

不透明度：0.8

（在弹出窗口中），则可以尝试以下操作：

.at300b > * {
    opacity: 0.8;
}

.at300b:hover, .at300b:hover > * {
    opacity: 1;
}

---

这有点像黑客，但如果你永远也找不到为什么会有这种行为，那就行了。

好的。我在这里放了一个HTML5版本：它解决了最初的问题（透明度现在总是100%），尽管它现在与其他addthis按钮集成得不太好，并且喜欢似乎对共享总数没有贡献…HTML5解决方案似乎依赖于iframe，这阻止addthis跟踪喜欢（），所以不太理想……好吧，这是一个黑客，但它似乎正在做的工作！非常感谢。没问题，你也可以尝试重新排序你的css文件/插件，看看这是否有什么不同