Home > Web Front-end > JS Tutorial > body text

jQuery implements carousel lottery with pop-up window and number of times (code)

不言
Release: 2019-03-29 09:54:09
forward
2082 people have browsed it

The content of this article is about the jQuery implementation of the carousel lottery with pop-up windows and times (code). It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

html:

    
        

您已拥有次抽奖机会,点击立刻抽奖!~

        
            
            
                     
    
Copy after login

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");
                }

            }
        });
    };
});
Copy after login

This article has ended here. For more other exciting content, you can pay attention to JavaScript on the PHP Chinese website Video tutorial column! ! !

The above is the detailed content of jQuery implements carousel lottery with pop-up window and number of times (code). For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:segmentfault.com
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!