css - Safari 不能旋转超过 360 度

标签 css google-chrome safari css-transitions css-transforms

Safari 6.0.2 可以进行超过 360 度的旋转吗?我有一个 simple experiment .在 Chrome 版本(不是金丝雀,会崩溃,moz 也会崩溃)和 Safari 中尝试。

更新:自从我找到解决方案后,我编辑了它使其在 Chrome 和 Safari 中正常工作,但我仍然提供了不正确的版本和正确的版本进行比较。(注意:此时 Safari 版本为 6.0.2)。顺便说一句,我只在 MAC 上测试,还没有在 Windows 上测试

版本不当:Fail in Safari

正确版本:Simple Experiment

最佳答案

transit时不能同时有多个transform style,例子

.春{

-webkit-transform: scale(1.0); /*we want rotate, so remove this*/
transform: scale(1.0); /*we want rotate, so remove this*/

-webkit-transition: all .8s ease;
transition: all .8s ease;

.春:悬停{

-webkit-transform: rotate(-900deg); /*we want this to be rotate few cycle*/
transform: rotate(-900deg);

正常状态不能缩放,悬停状态不能旋转。

这肯定是 safari 中的错误(或其他问题),因为 Chrome 可以正确处理它。

关于css - Safari 不能旋转超过 360 度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14914434/

相关文章:

css - Chrome 是否有设置 :visited css properties? 的问题

javascript - 谷歌浏览器自动填充不适用于所有机器

html - CSS 动画适用于 Chrome 和 Safari,但不适用于 Firefox 和 IE

c# - ViewState 仅在 Safari 中无效

html - 如何忽略 parent 的div中心位置

css - 什么可能导致 IE8 中出现此背景 "fade"?

javascript - *onbeforeunload* 是否缓存在 Safari (macOS) 上?

html - Safari Border Radius 裁剪问题

html - 如何将 div 包裹在不均匀的内容周围

html - 在 Firefox 中,溢出滚动条未显示在 100% 高度 div 上