jQuery帶次數帶彈窗的大轉盤抽獎代碼(支持h5)

jQuery帶次數帶彈窗的大轉盤抽獎代碼(支持h5)
jQuery帶次數帶彈窗的大轉盤抽獎代碼(支持h5)

html:

<div class="g-content">
    <div class="g-lottery-case">
        <div class="g-left">
            <h2>您已擁有<span class="playnum"></span>次抽獎機會,點擊立刻抽獎!~</h2>
            <div class="g-lottery-box">
                <div class="g-lottery-img">

                </div>
                <a class="playbtn" href="javascript:;" title="開始抽獎"></a>
            </div>
        </div>
    </div>
</div>

js:


    $(function() {
        var $btn = $('.playbtn');
        var $btn02 = $('.g-lottery-img');
        var $tan=$('#info');
        var playnum = 1; //初始次數,由後臺傳入
        $('.playnum').html(playnum);
        var isture = 0;
        var clickfunc = function() {
            var data = [1, 2, 3, 4, 5];
            //data爲隨機出來的結果,根據概率後的結果
            data = data[Math.floor(Math.random() * data.length)];
            switch(data) {
                case 1:
                    rotateFunc(1, 36, '01');
                    break;
                case 2:
                    rotateFunc(2, 108, '02');
                    break;
                case 3:
                    rotateFunc(3, 180, '03');
                    break;
                case 4:
                    rotateFunc(4, 252, '04');
                    break;
                case 5:
                    rotateFunc(5, 324, '05');
                    break;

            }
        }
        if(playnum>0)
        {
            $('.playbtn').addClass("playbtn02");

        }

        $btn.click(function() {
            if(isture) return; // 如果在執行就退出
            isture = true; // 標誌爲 在執行
            //先判斷是否登錄,未登錄則執行下面的函數
            if(1 == 2) {
                $('.playnum').html('0');
                alert("請先登錄");
                isture = false;
            } else { //登錄了就執行下面
                if(playnum <= 0) { //當抽獎次數爲0的時候執行
                    alert("沒有次數了");

                    $('.playnum').html(0);
                    isture = false;
                } else { //還有次數就執行

                    playnum = playnum - 1; //執行轉盤了則次數減1
                    if(playnum <= 0) {
                        playnum = 0;
                    }
                    $('.playnum').html(playnum);
                    clickfunc();
                }
            }
        });
        var rotateFunc = function(awards, angle, text) {
            isture = true;
            $btn.stopRotate();
            $btn02.rotate({
                angle: 0,
                duration: 4000, //旋轉時間
                animateTo: angle + 1440, //讓它根據得出來的結果加上1440度旋轉
                callback: function() {
                    isture = false; // 標誌爲 執行完畢
                    $('#info'+text).show();
                    if(playnum <= 0) { //當抽獎次數爲0的時候執行
                        $('.playbtn').removeClass("playbtn02");
                    }

                }
            });
        };
    });

下載地址:https://u18725144.ctfile.com/fs/18725144-331468122

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章