css - 图像上的 Webkit 转换未在移动设备上显示

Question

此转换在桌面上运行良好，但在移动设备上，“悬停”事件被解释为在移动设备上点击，只会使图像消失而不是替换新图像。所有其他转换都有效。

.mark.studio{
   background: url(../images/studio_icon.png) no-repeat;
   -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out; 
   transition: all .3s ease-in-out; 
   height: 50px;
   width: 50px;
   z-index:103 !important;
}

.mark.studio:hover{
   -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out; 
  -transition: all .3s ease-in-out; 
   background: url(../images/studio_icon-hover.png) no-repeat;
}

Answer 1

我没有 Android 手机，只有 iOS 设备，但我知道到目前为止，transition 属性在图像方面的支持非常分散。与 Firefox 和 Internet Explorer 一样，都支持转换代码，但当它用于缓入和缓出图像时则不支持。我和另一个人一起回答了一个类似的问题，背景图像的过渡属性不起作用，我们都得出结论，它在很多浏览器中都不起作用。哦，我刚找了，帖子是你发的! css3 transform on image hover in firefox .那么这篇文章基本上回答了你的问题。 :)

它可能不会修复它(但无论如何尝试它都很好)，在悬停时重复过渡属性是没有意义的......