HTML5抽奖转盘-CSS3超简单版本
核心思路 采用CSS3的transition（过渡效果），给定需要旋转的元素设置transform的rotate属性的结束角度，同时添加transition-timing-function来控制旋转的速率包括起始速率和结束速率，代码如下（浏览器前缀可自行添加）： #pointer { transition: transform 6 .5s; transition -timing- function : ease- in - out; } 这样，给定结束角度后，元素就会旋转，结束角度可以自由控制旋转的圈数，例如结束角度为angelEnd，即圈数 m=angelEnd/360 并取整，前几圈转满360无需特殊处理，关键是最后一圈的角度决定了抽奖的结果，代码如下： let base = 2160; // 先转满360×6圈 let result = getRandom(-30,330); // 最后一圈角度，获取-30到330的随机数 let angelEnd = -(base+result) // 结束角度数，负数代表逆时针旋转 $("#pointer").css({"transform":"rotate("+angelEnd+"deg)"}); // 设置CSS 判断抽奖结果 通过监听旋转元素的 transitionend 获得动画结束的事件，在此回调中，可以判断抽奖结果