天天看点

转盘抽奖插件概率实现

插件代码:

function turntableDraw(obj,jsn)
{
    "use strict";
    this.draw = {};
    this.draw.obj = $(obj);
    this.draw.objClass = $(obj).attr("class");
    this.draw.newClass = "rotary"+"new"+parseInt(Math.random()*);
    var _jiaodu = parseInt(/jsn.share);
    var _yuan = *(jsn.weeks || );
    var _str = "";
    var _speed = jsn.speed || "2s";
    var _velocityCurve = jsn.velocityCurve || "ease";
    var _this = this;
    for(var i=;i<=jsn.share;i++)
    {
        _str+="."+this.draw.newClass+i+"{";
        _str+="transform:rotate("+((i-)*_jiaodu+_yuan)+"deg);";
        _str+="-ms-transform:rotate("+((i-)*_jiaodu+_yuan)+"deg);";
        _str+="-moz-transform:rotate("+((i-)*_jiaodu+_yuan)+"deg);";
        _str+="-webkit-transform:rotate("+((i-)*_jiaodu+_yuan)+"deg);";
        _str+="-o-transform:rotate("+((i-)*_jiaodu+_yuan)+"deg);";
        _str+="transition: transform "+_speed+" "+_velocityCurve+";";
        _str+="-moz-transition: -moz-transform "+_speed+" "+_velocityCurve+";";
        _str+="-webkit-transition: -webkit-transform "+_speed+" "+_velocityCurve+";";
        _str+="-o-transition: -o-transform "+_speed+" "+_velocityCurve+";";
        _str+="}";
        _str+="."+this.draw.newClass+i+"stop{";
        _str+="transform:rotate("+((i-)*_jiaodu)+"deg);";
        _str+="-ms-transform:rotate("+((i-)*_jiaodu)+"deg);";
        _str+="-moz-transform:rotate("+((i-)*_jiaodu)+"deg);";
        _str+="-webkit-transform:rotate("+((i-)*_jiaodu)+"deg);";
        _str+="-o-transform:rotate("+((i-)*_jiaodu)+"deg);";
        _str+="}";
    };
    $(document.head).append("<style>"+_str+"</style>");
    _speed = _speed.replace(/s/,"")*;
    this.draw.startTurningOk = false;
    this.draw.goto=function(ind){
        if(_this.draw.startTurningOk){return false};
        _this.draw.obj.attr("class",_this.draw.objClass+" "+_this.draw.newClass+ind);
        _this.draw.startTurningOk = true;
        setTimeout(function(){
            _this.draw.obj.attr("class",_this.draw.objClass+" "+_this.draw.newClass+ind+"stop");
            if(jsn.callback)
            {
                _this.draw.startTurningOk = false;
                jsn.callback(ind);
            };
        },_speed+);
        return _this.draw;
    };
    return this.draw;
};
           

使用方式:

//share份额[数字没有默认],
//speed速度[单位s,最小0.1s],
//velocityCurve速度曲线[linear匀速,ease慢快慢,ease-in慢慢开始,ease-out慢慢结束,ease-in-out慢快慢等,用的是css3的速度曲线],可以不写,ease默认值;
//callback回调函数
//weeks几周[默认2周,可以不写]

//几份和回调函数这两个参数是必填

function callbackA(ind)
{
    alert("第一个回调"+ind);
};

var newdraw =new turntableDraw('.drawBtn',{
    share:,
    speed:"3s",
    velocityCurve:"ease",
    weeks:,
    callback:function(num)
    {
        callbackA(num);
    },
});

$(".drawBtn1").click(function(event) {
    //ajax 
    //这里的数字即是中奖数字,如果要控制概率就对其进行处理即可,不处理就是相同的随机概率
    newdraw2.goto(parseInt(Math.random()*)+);
});
           

继续阅读