html - 为什么此CSS动画无法在IOS上运行？

Question

我有旋转文本的关键帧，在台式机和Android浏览器中一切正常，但是在IOS中，动画不起作用，文本仅消失了。

@-webkit-keyframes texttrans{
  from{-webkit-transform:rotateY(0deg);}
  50%{-webkit-left:56%;-webkit-transform:rotateY(180deg);-webkit-transform:rotateX(0deg); -webkit-opacity:1;}
  75%{-webkit-left:56%;-webkit-transform:rotateX(360deg); -webkit-opacity:1;}
  100%{-webkit-left:56%;-webkit-transform:rotateX(360deg); -webkit-opacity:1;}
}

@keyframes texttrans{
  from{transform:rotateY(0deg);}
  50%{left:56%;transform:rotateY(180deg);transform:rotateX(0deg); opacity:1;}
  75%{left:56%;transform:rotateX(360deg); opacity:1;}
  100%{left:56%;transform:rotateX(360deg); opacity:1;}
}

Answer 1

我建议您在项目中使用WOW动画，它们目前可在大多数设备和现代浏览器上使用，并且易于实现。

您可以在此处查看文档：wowjs.uk/docs

动画和预览的完整列表可以在此处查看：Animate.css

希望这可以帮助。