我如何制作一个即使不使用画布也能旋转的幸运之轮项目？

Question

所以，对于我们的项目，我们必须制作一个命运之轮游戏（基于游戏节目），我制作了所有东西（比如检查单词是否正确等等），但我仍然不知道如何去做做动画。我必须制作动画的内容类似于附图中的内容。老师告诉我们不能用canvas，所以我不能用.rotate()。那么，有没有人对如何实现这一点有任何想法？请记住，我什至不需要轮子来实际旋转；即使只是图片改变位置也可以工作。

这是一个样品轮的图片（假设数字都是图片）。我已将所有图片存储在包含所有图片的单个数组中： https://en.m.wikipedia.org/wiki/Wheel_of_Fortune_(U.S._game_show)#/media/File%3AWheel_of_Fortune_Round_1_template_Season_31.png

PS：出于学术诚实的目的，我将无法在此处发布我的代码。

感谢大家的宝贵时间！

Answer 1

这是一个非常基本的方法：http://codepen.io/AaronGeorge/pen/zoOWag

您使用的是 CSS 变换属性并使用旋转值。

您需要进行一些数学运算才能计算出需要旋转多少图像，但transform: rotate(amount); 无需使用画布即可解决问题。