当hover时不透明度发生变化时，Google Chrome中的背景转换
我有一个使用Jquery设置的hover效果，它改变了hover元素的不透明度。 它适用于所有最近的浏览器，除了Chrome，它会改变身体元素的背景。
这是链接： http ： //wrong.ro/tataia/
我的工作环境如下：Google Chrome v18.0.1025.162 / Windows 7 x64。
这有什么解决方法吗？ 提前致谢！
我经历过非常接近的事情，在我的情况下，在hover时改变不透明度导致前景图像元素摆动。 看起来特定原因与使用变换（我正在使用）有关。 修复很简单 – 在img元素上我添加了：
-webkit-backface-visibility: hidden; 没有更多的摆动。 我不熟悉它实际上做了什么，但它没有任何奇怪的副作用并解决了问题。
我还看到了一个我没试过的替代解决方案 – 显然其他人已经体验过这个并用旋转修复它：
-webkit-transform: rotate(0); -moz-transform: rotate(0); transform: rotate(0);
我终于可以在Chrome中看到问题。 这是非常微妙的，所以除非你确切知道你在寻找什么，否则很容易错过。
我还在处理剩下的问题，但当我将鼠标hover在中间的“stiati ca”标志上时，我可以看到背景偏移到图像的左侧。
问题似乎与CSS的background-size部分有关。 如果我删除background-size行，问题就完全消失了。 我并不是说这是问题的真正原因，但这是第一个线索。 我在调查的这一点上的猜测（稍后将在答案中提到）是hover中的某些东西导致文档大小改变，导致背景重新缩放并因此转移：
body { background: black url('../img/bck.jpg') left top fixed no-repeat; moz-background-size: cover; background-size: cover; -ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/bck.jpg', sizingMethod='scale')"; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/bck.jpg', sizingMethod='scale'); }
进一步追求这个，我发现如果我从这个CSS块中注释掉text-indent行：
a#stiati_ca{ display: block; width: 124px; height: 124px; xtext-indent: -9999em; background: url('../img/stiati_ca.png') no-repeat; margin: 88px auto 0; }
然后，hover在徽标上的问题完全消失了。 当然，你的链接中有一些文字显示我猜你不想看到，但你可以修复HTML以不同的方式工作。 我建议在其中使用带有固定大小div的链接（链接中没有文本），然后在div上设置背景图像，而不是在链接本身上。 无论如何，这是一种更安全的跨浏览器方式，您不需要文本缩进线，并且背景移位问题应该消除徽标图像。 如果您确实需要链接中的文本但不希望它显示，则将其放在跨度中并使用display: none使跨度不可见。 无论哪种方式，您都不应该在上设置背景图像，而是在链接中具有适当大小的元素上设置背景图像。 这应该更好。
我还没弄清楚为什么在前四个图像上出现同样的问题。 如果我想出那个，我会添加到我的post中。