Question

页面顶部的徽标是一个精灵，在顶部和底部之间切换以产生发光效果。这是通过css transition和：hover伪元素来完成的。

然而，我最近添加了'projekktor'HMTL5视频播放器。它的效果非常好，但是如果你开始播放视频，然后将徽标悬停在鼠标悬停时就会出现故障。

此外，谷歌浏览器不播放从ea.com提供的视频战地3剪辑。 Chrome不会播放它，这两件事让我疯狂。他们有关系吗？我做错了什么？

Projekktor主页：http://www.projekktor.com/

它在每个浏览器中的表现都不同。 Firefox中的速度非常慢，但它可以播放。完美的Safari，CHrome根本不会播放，但Safari有一个小故障的标志。有什么想法吗？

Answer 1

我修好了。我删除了两个锚中的一个，并从div中删除了headlink text-indent属性，并将其放在单个锚上。奇怪的问题，奇怪的解决方案。为了将来的参考，不要尝试文本缩进深埋一层以上的文本，在翻滚时它会来回跳跃。

<div title="The Nozzle" id="headerlogo">
    <div title="The Nozzle" id="logo1"></div>
    <a style="text-indent:-9999px" title="The Nozzle" href="http://thenozzle.net/"><div title="The Nozzle" id="logo2"></div>The Nozzle</a>
</div>

HTML5视频在CSS中引起奇怪的故障：悬停转换，跨浏览器不能很好地工作

1 个答案: