Question

这种转换在桌面上运行良好，但在移动设备上＆＃34; hover＆＃34;事件被解释为手机上的点击，只是使图像消失而不是替换新图像。所有其他过渡都有效。

.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设备，但我知道到目前为止，转换属性对图像的支持非常分散。像Firefox和Internet Explorer一样支持转换代码，但不能用于缓存图像。我和其他人一起回答了类似的问题，过渡属性背景图片不起作用，我们都得出结论，它在很多浏览器中都不起作用。哦，我只是找了它，帖子是你的！ css3 transform on image hover in firefox。那个帖子基本上回答了你的问题。：）

它可能无法修复它（但无论如何都要尝试它很好），在悬停时重复转换属性毫无意义......

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

1 个答案: