点击中间的转盘开始，就会立即抽奖，最好弹出一个中奖红包弹出层，金额是随机，这个数据最好在后台控制，前台用来展示。

抽奖html代码

<div class="turntable-bg"> 
    <div class="pointer"><img src="images/pointer.png" alt="pointer"/></div> 
    <div class="rotate" ><img id="rotate" src="images/turntable.png" alt="turntable"></div> 
</div>

抽奖奖项设置和转盘转动角度

var rotateTimeOut = function() { 
    $('#rotate').rotate({ 
        angle: 0, 
        animateTo: 2160, 
        duration: 8000, 
        callback: function() { 
            alert('网络超时，请检查您的网络设置！'); 
        } 
    }); 
}; 
var bRotate = false; 
 
var rotateFn = function(awards, angles, txt) { 
    bRotate = !bRotate; 
    $('#rotate').stopRotate(); 
    $('#rotate').rotate({ 
        angle: 0, 
        animateTo: angles + 1800, 
        duration: 8000, 
        callback: function() { 
            /*alert(txt);*/ 
            swal({title: "获得" + txt + "红包", imageUrl: "images/gx.png"}); 
 
            bRotate = !bRotate; 
        } 
    }) 
}; 
 
document.onkeydown = function(event) { 
    var e = event || window.event || arguments.callee.caller.arguments[0]; 
 
    if (e && e.keyCode == 32) { // enter 键 
        $('showSweetAlert').css("display", "none"); 
        $('sweet-overlay').css("display", "none"); 
 
        if (bRotate) 
            return; 
        var item = rnd(1, 5); 
 
        switch (item) { 
            case 1: 
                //var angle = [26, 88, 137, 185, 235, 287, 337]; 
                rotateFn(1, 55, '888元'); 
                break; 
            case 2: 
                //var angle = [88, 137, 185, 235, 287]; 
                rotateFn(2, 140, '388元'); 
                break; 
            case 3: 
                //var angle = [137, 185, 235, 287]; 
                rotateFn(3, 199, '188元'); 
                break; 
            case 4: 
                //var angle = [137, 185, 235, 287]; 
                rotateFn(4, 269, '88元'); 
                break; 
            case 5: 
                //var angle = [185, 235, 287]; 
                rotateFn(5, 341, '8元'); 
                break; 
 
        } 
 
        console.log(item); 
 
    } 
}; 
 
$('.pointer').click(function() { 
 
    if (bRotate) 
        return; 
    var item = rnd(1, 5); 
 
    switch (item) { 
        case 1: 
            //var angle = [26, 88, 137, 185, 235, 287, 337]; 
            rotateFn(1, 55, '888元'); 
            break; 
        case 2: 
            //var angle = [88, 137, 185, 235, 287]; 
            rotateFn(2, 140, '388元'); 
            break; 
        case 3: 
            //var angle = [137, 185, 235, 287]; 
            rotateFn(3, 199, '188元'); 
            break; 
        case 4: 
            //var angle = [137, 185, 235, 287]; 
            rotateFn(4, 269, '88元'); 
            break; 
        case 5: 
            //var angle = [185, 235, 287]; 
            rotateFn(5, 341, '8元'); 
            break; 
 
    } 
});

源码放在这里了：https://gitee.com/xiaobozaishanghai/hongbao

演示参考下这里：https://www.erdangjiade.com/jquery/8/889/demo/

最后分享下我的博客网站，里面有很多网站开发的素材：https://www.erdangjiade.com/