CSS'transform：scale（）'属性在iOS Safari和iOS Chrome上不起作用

我使用了我的网站的css动画，但它在基于iOS的Safari和Chrome中不起作用。CSS'transform：scale（）'属性在iOS Safari和iOS Chrome上不起作用

HTML：

... 
<p> 
    <a href="mywebsite.hu/something1.php"> 
     <img src="picture1.jpg" class="kep" > 
    </a> 
    <a href="mywebsite.hu/something2.php"> 
     <img src="picture2.jpg" class="kep" > 
    </a> 
    <a href="mywebsite.hu/something3.php"> 
     <img src="picture3.jpg" class="kep" > 
    </a> 
</p> 
...

CSS：

img.kep{ 
    transition: transform.1s linear; 
    -moz-transition: transform.1s linear; 
    -webkit-transition: transform.1s linear; 
} 
img.kep:hover{ 
    transform: scale(1.04); 
    -ms-transform: scale(1.04); 
    -moz-transform: scale(1.04); 
    -webkit-transform: scale(1.04); 
}

它可以在窗口（IE，Mozilla的浏览器，歌剧，维瓦尔第，Safari浏览器），机器人（浏览器，默认三星Galaxy浏览器）。但是，在iPad2与iOS 9.2.1（Safari，Chrome）不起作用！

为什么？

来源

2016-02-28 Barbér Máté

首先，您应该始终在列表中包含最后一个非前缀属性。 transition和transform应低于所有前缀版本。

因此，如果它被支持，它将被用于一个潜在的老前缀版本。

其次，你只是过渡transform。所以-webkit-transform不会被改变。你可能是最好的转换all

第三，你没有transform和.1s之间的空间。应该是一个空间。

来源

2016-02-28 14:53:18

所以我使用这个 - > img.kep {{{0} {0}} {{0}}}}} \t -moz-transition：-moz-transform 1s linear; \t transition：-ms -trans 1s linear; \t转换：变换1s线性; } 或这 - > img.kep { \t -webkit过渡：-webkit变换1S线性; \t -moz-transition：-moz-transform 1s linear; \t -ms-transition：-ms-transform 1s linear; \t转换：变换1s线性; } 还是别的？ –

过渡：全1s线性; <这是你刚才所说的简写。如果您不改变同一元素上的任何其他动画属性，那么您就不需要动画。 –

@BarbérMáté你明白了吗？ –

CSS'transform：scale（）'属性在iOS Safari和iOS Chrome上不起作用

回答

相关问题