3

我注意到标准 :hover 在以非原始宽度值显示的图像上,当鼠标悬停生效时会导致轻微的摇晃动画。我认为这是由于发生了一些像素舍入,但是为什么悬停时显示的图像不同?

请参考我在http://jsfiddle.net/z29LM/8/上的测试用例

请注意,前两个图像在悬停时很好(因为它们使用原始图像宽度/高度),但所有其他图像似乎在右侧和底部添加了 1 个像素。应用哪种悬停效果似乎并不重要(例如,背景颜色会导致相同的问题)。

所以解决方法似乎是打开 Gimp 并手动将图像调整到目标宽度/高度,或者是否有针对这种现象的 html/css 修复?

编辑: 所以这似乎是一个仅限 Firefox 的错误(使用 13.0.1)。答案中发布的链接建议通过添加box-shadow: #000 0em 0em 0em;到图像元素来快速修复。有关固定/工作版本,请参阅http://jsfiddle.net/z29LM/9/ 。

4

1 回答 1

4

这是 Firefox 的一个错误(它最初曾一度被修复,但在 FF10 之后重新出现)。

我的圣人建议?将浏览器调整大小保持在最低限度。

于 2012-07-09T21:57:29.993 回答