九宫格抽奖转盘

一.效果图如下：

实现图

二.技术点实现

1. 布局实现
   用到了table布局

2. 转盘转动方法

    function roll(){
        lottery.times += 1;
       lottery.roll();//转动过程调用的是lottery的roll方法，这里是第一次调用初始化
        if (lottery.times > lottery.cycle+10 && lottery.prize==lottery.index+1) {
            clearTimeout(lottery.timer);
            lottery.prize=-1;
            lottery.times=0;
             lottery.stop();
            // alert('恭喜您！获得'+getPrizerUser.amount+"元");
            click=false;
        }else{
            if (lottery.times lottery.cycle+10 && ((lottery.prize==0 && lottery.index==7) || lottery.prize==lottery.index+1)) {
                    lottery.speed += 110;
                }else{
                    lottery.speed += 20;
                }
            }
            if (lottery.speed<40) {
                lottery.speed=40;
            };
            //console.log(lottery.times+'^^^^^^'+lottery.speed+'^^^^^^^'+lottery.prize);
            lottery.timer = setTimeout(roll,lottery.speed);//循环调用
        }
        return false;
    }

3.将此抽奖网址集成在APP上
因为我们的需求是转盘抽奖用h5写，然后将此网址用APP加载，APP在加载时传入Token，后台在抽奖接口中判断此人积分是否可用抽奖，将抽奖结果回调给APP做弹框提示！

APP展示抽奖结果

三.说明
此抽奖参考文章：https://www.cnblogs.com/starof/p/4933907.html，因为用JQuery写的，本人知识匮乏，只能在此基础上修改成自己需要的。

具体请参考Demo