Question

所以我有一个带有图像的div，我希望以0.7不透明度开始，并在悬停时更改为1，但我遇到一个明显的错误，图像移动1px或小1px（我不能当我在悬停时改变不透明度时，请确定是哪个这显然是一个已知的错误，但其他问题中的修复都没有对我有用。我试过设置背面可见性：隐藏;并进行转换，但错误仍然存在。

这个bug有什么新的解决方案吗？

.collapse img { 
    width: 100%;
    margin-top: -90px; 
    margin-left: 75px;
    opacity: 0.7; 
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0) scale(1.0, 1.0);
    border:none;
} 
.collapse:hover img {
    width: 100%; 
    opacity: 1;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0) scale(1.0, 1.0); 
    border:none;
}

谢谢，亚当

编辑 - JS小提琴 - http://jsfiddle.net/wfe70gd1/6/

可以在此处看到实例（图表下方的右栏） - http://mmdoc.ajhtestserver.com/decks/1/

此外，它似乎只在Firefox中发生

Answer 1

您希望将背面可见性选择器添加到父类（.collapse）。您还需要包含选择器的Mozilla版本。包括Opera也不会受伤。

-backface-visibility: hidden;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-o-backface-visibility: hidden;
-webkit-transform: translateZ(0) scale(1.0, 1.0);

Img在改变不透明度时移动：悬停

1 个答案: