CSS3 不透明度转换期间字体变暗是否有解决方法?
我有一个 HTML 元素,其不透明度在悬停时发生变化(使用 CSS3 过渡)。问题是,在 Firefox 中(至少在 Windows 上),元素 (a
) 内的文本 (a
) 在不透明度更改期间明显变暗,然后“弹回”到应有的方式转换结束后不到一秒。像这样(视频):
http://screencast.com/t/zzWc9EF8wq4c
此问题不会出现在铬合金。
有什么想法可能导致这种情况吗?有什么解决方法吗?
I've got an HTML element where the opacity changes on hover (using a CSS3 transition). The problem is that in Firefox (on Windows at least), the text (a <p>) within the element (a <div>) dims perceptibly during the opacity change, then "pops back" to the way it should be a fraction of a second after the transition ends. Like this (video):
http://screencast.com/t/zzWc9EF8wq4c
This problem does not occur in Chrome.
Any ideas what might be causing this? Any workarounds?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
尝试在元素上使用 RGBA 颜色并进行过渡,而不是过渡元素的不透明度(因为这会级联到 DOM 树中的所有较低元素)。这就是我在我的项目中所做的:)
Try using an RGBA color on your elements and transition that instead of transitioning the elements opacity (because this cascades down to all lower elements in the DOM tree). Thats how i do it on my projects :)