Question

CSS3中，如果初始化div已经绕Y轴旋转一定角度， 如何让div连续不停的绕Y轴旋转。

如图所示，4个div绕Y轴分别旋转0°、90°、180°、270°，如何让其保持现状，一直绕Y轴旋转下去？

Answer 1

你现在可以旋转一圈吗，如果可以就用一个setInterval()方法来调用函数，它会不停的调用函数，
如果你现在只是写了这个静态的样式，有2中方法，
1种是把html5和css3中类似于时钟的做法，网上又很多，自己查一下，
第2中方法是做成一个3d效果的，js加上css3中专为3d设计的属性 rotateY()，你可以看一下

追问

现在是静态的样式，我用过setInterval()方法，无奈它是单线程的，也就是说只有一个div可以实现一直旋转的效果。css3 3d我也试了，因为要考虑N个div的情况，也没有实现。

追答

你想让4个div单独依次围绕y轴旋转，还是一个整体围绕y轴旋转？

追问

整体最好。

追答

那你采用css3中的3d效果吧，你这个相当于就是一个3d旋转效果了，不过你要看看3d效果的制作流程，再做不好，晚上我发一个类似你这情况的3d效果给你，你自己看看

Answer 2

-webkit-animation:xz 3s linear 1s infinite

追问

xz 怎么写？每个div的初始角度都不一样。。

@-webkit-keyframes xz{
0% { -webkit-transform:rotateY( ?? deg); }
100% { -webkit-transform:rotateY( ?? deg); }
}