此jquery特效是一款非常实用的功能,实现了jquery圆盘抽奖功能,应用场景很广,很多网站为了吸引更多的用户都会搞一些抽奖活动,JquerySchool网站上前端已经分享了一个方形的像老虎机一样抽奖特效,但不够圆盘转动的好看,今天把这个作品整理出来分享给大家,兼容所有的浏览器,会后台程序的网友可以设置与后台交互,具体的查看作品里面的参数配置。。。。
参数配置jquery代码如下:
var turnplate = {
turnplateBox : $('#turnplate'),
turnplateBtn : $('#platebtn'),
lightDom : $('#turnplatewrapper'),
freshLotteryUrl : 'http://huodong.kuaipan.cn/ajaxTurnplate/freshLottery/',
msgBox : $('#msg'),
lotteryUrl : 'http://huodong.kuaipan.cn/ajaxTurnplate/lottery/',
height : '592', //帧高度
lightSwitch : 0, //闪灯切换开关. 0 和 1间切换
minResistance : 5, //基本阻力
Cx : 0.01, //阻力系数 阻力公式: totalResistance = minResistance + curSpeed * Cx;
accSpeed : 15, //加速度
accFrameLen : 40, //加速度持续帧数
maxSpeed : 250, //最大速度
minSpeed : 20, //最小速度
frameLen : 10, //帧总数
totalFrame : 0, //累计帧数,每切换一帧次数加1
curFrame : 0, //当前帧
curSpeed : 20, //上帧的速度
lotteryTime : 0, //抽奖次数
lotteryIndex : 6, //奖品index
errorIndex : 6, //异常时的奖品指针
initBoxEle : $('#turnplate #init'),
progressEle : $('#turnplate #init span'),
initProgressContent : '~~~^_^~~~', //初始化进度条的内容
initFreshInterval : 500, //进度条刷新间隔
virtualDistance : 10000, //虚拟路程,固定值,速度越快,切换到下帧的时间越快: 切换到下帧的时间 = virtualDistance/curSpeed
isStop : false, //抽奖锁,为true时,才允许下一轮抽奖
timer2 : undefined, //计时器
initTime : undefined,
showMsgTime : 2000, //消息显示时间
lotteryChannel: ''
}
效果如下:
如果您觉得本作品对您的学习有所帮助:
关键字:
圆盘抽奖 图片3D旋转 360度旋转 3D特效 大转盘 抽奖特效 jquery抽奖