<div class="mainbj">
<div class="box">
<img src="static/img/zpbj.png" class="zpbjimg">
<div class="zpimgbox">
<img src="static/img/zp.png" class="zpimg">
</div>
<img src="static/img/btn1.png" class="zpbtn">
</div>
</div>
<script src="static/jscss/jquery.js"></script>
<script src="https://cdn.suoluomei.com/common/js2.0/jquery.rotate/jquery.rotate.min.js"></script>
<script>
$(function () {
var flog = true
$(".zpbtn").rotate({
bind: {
click: function () {
if (flog) {
flog = false
var math = Math.floor(Math.random() * 10);
var sectorId = math //选中的奖品地址是需要后台传给你
var part = 8 //奖品的总个数
var defaultRotate = 1800 //一圈360度,旋转5圈
var setRotate = (360 / part) * sectorId - (360 / part) / 2 //计算定位到指定商品在商品的中间
var allRotate = defaultRotate + setRotate //总旋转度数
$('.zpimg').rotate({
duration: 10000,
angle: 0,
animateTo: allRotate,
callback: function () {
flog = true
}
})
}
}
}
})
})
</script>
不停旋转
function rotate() {
$('.zpimg').rotate({
animateTo: 360,
angle: 0,
easing: function (x, t, b, c, d) {
return c * (t / d) + b;
},
callback: function () {
rotate()
}
})
}
停止旋转
$('.zpimg').stopRotate();