javascript - css3中rotate在x轴与y轴同时旋转的时候，具体是怎样的旋转顺序？

问题描述

问 题

@keyframes rot{

   from{transform:rotateY(0deg) rotateX(0deg);}
   to{transform:rotateY(360deg) rotateX(360deg);}
   
      }
      就是将这个动画运用在某个元素上面的时候，是先完成y轴的旋转，之后再执行x轴的旋转吗？还是怎样？对运行出来的效果，有点不明白

解决方案

只关心起始和结束的状态。中间的都是插值计算出来的。
而且transform:rotateY(360deg) rotateX(360deg)在计算最终形态的时候(使用矩阵)，是会先算后面的，再算前面的。
可以去搜关键词matrix transform
参考这个链接，较早前提的一个问题，答案比较好的解释了插值计算的过程。

这篇关于javascript - css3中rotate在x轴与y轴同时旋转的时候，具体是怎样的旋转顺序？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！