插件代碼:
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()*)+);
});