工作需要,所以做了个抽奖转盘的插件,当然这里只做最简单的演示。可以用于取代一些flash抽奖程序。

机制说明:

1、通过定义lottery-unit来控制节点的个数及索引;

2、通过设置lottery.crcle来定义需要转动的基本次数,在这个次数内,定时器的时间间隔不断递减,知道某个具体的数值;

3、当外界设置了lottery.prize即中奖目标的索引后,检查当当前转动次数已经大于lottery.crcle,这个过程开始递减定时器的时间间隔,直到lottery.prize等于lottery.prize,这时候初始化所有参数。

原文:http://blog.cxycs.com/article/56

在线演示:http://blog.cxycs.com/demos/lottery/

源码下载:http://blog.cxycs.com/demos/lottery.rar

JS:九宫格抽奖转盘实例的更多相关文章

  1. JS数组抽奖程序教学实例

    数组Javascript中非常重要的知识点,为了在课堂上提高学生兴趣,教学举例的选择就比较重要了. 为了提高学生兴趣,特设计一个可输入,可控制结束的,利用JS数组实现的抽奖教学实例.代码如下:

  2. C#保留2位小数几种场景总结 游标遍历所有数据库循环执行修改数据库的sql命令 原生js轮盘抽奖实例分析(幸运大转盘抽奖) javascript中的typeof和类型判断

    C#保留2位小数几种场景总结   场景1: C#保留2位小数,.ToString("f2")确实可以,但是如果这个数字本来就小数点后面三位比如1.253,那么转化之后就会变成1.2 ...

  3. php+lottery.js制作九宫格抽奖实例

    php+lottery.js制作九宫格抽奖实例,本抽奖功能效果表现好,定制方便简单,新手学习跟直接拿来用都非常不错,兼容IE.火狐.谷歌等浏览器. 引入抽奖插件lottery.js <scrip ...

  4. jquery——九宫格大转盘抽奖

    一.用到的图片 二.代码如下,重点是js部分 <!DOCTYPE html> <html> <head> <meta http-equiv="Con ...

  5. PHP+Ajax微信手机端九宫格抽奖实例

    PHP+Ajax结合lottery.js制作的一款微信手机端九宫格抽奖实例,抽奖完成后有收货地址添加表单出现.支持可以设置中奖概率等. 奖品列表 <div class="lottery ...

  6. 【Vue.js游戏机实战】- Vue.js实现大转盘抽奖总结

    大家好!先上图看看本次案例的整体效果. 实现思路: Vue component实现大转盘组件,可以嵌套到任意要使用的页面. css3 transform控制大转盘抽奖过程的动画效果. 抽奖组件内使用钩 ...

  7. 使用CSS3+jquery.js 实现微信抽奖转盘效果

    上次发表了一篇 微信抽奖转盘活动-效果源码分析 最近想起了刚接到这个项目时第一时间脑海里迸出的解决方法 “CSS3”! 为什么不能用CSS3来实现呢? 所以我打算用CSS3来实现这个效果.并不需要依赖 ...

  8. 抽奖转盘(jqueryrotate.js)

    jqueryrotate.js抽奖转盘,使用方便,兼容各浏览器,效果如下图 <!DOCTYPE> <head> <meta http-equiv="Conten ...

  9. Js写九宫格抽奖

    国庆出去转了一圈,回来及时把以前写的一些有用的在这儿记录一下 --------------------------------------------我是分割线-------------------- ...

随机推荐

  1. [转] CSS direction属性简介与实际应用 ---张鑫旭

    一.用的少并不代表没有用 至少,在我接触的这么多项目里,没有见到使用过CSS direction属性做实际开发的. 为什么呢?是因为direction长得丑吗? 虽然说direction确实其貌不扬, ...

  2. PHP导出excel信息表格

    //导出表格public function get_exel($fileName,$headArr,$list){//导入PHPExcel类库,因为PHPExcel没有用命名空间,只能import导入 ...

  3. js 图片base64

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name ...

  4. 查看yum包安装地址

    首先找到包含版本号在内的全包名 rpm -qa|grep t_dp_apsara_exstoret_dp_apsara_exstore-1.0.5-56 然后就可以查询到了 rpm -ql t_dp_ ...

  5. Silverlight中在MVVM模式下对DatagridRow选择控件封装

    在项目中,凡是涉及到表格的地方用的最多的控件,自然少不了DataGrid的身影,它明了的展示各种数据让人十分喜欢.现在要实现一个功能,使DataGrid具有全选和项选中的功能,如果在传统后台代码中完成 ...

  6. Sharepoint 问题集锦 - 外部列表(external list) - 读取当前用户上下文或用户名作为筛选参数

    在创建外部列表过程中,往往需要添加筛选参数,而较多开发用户,会关心如何在外部列表中,只显示当前用户相关的行.本例子中,我们以任务数据表来做例子,看看如何实现这个需求. 1)数据表tbl_task: t ...

  7. 编程思想—依赖注入(DI)并非实现控制反转(IOC)的最佳方法

    以构造函数注入为例: public class TestClass(IClassA a,IClassB b, IClassC C,IClassD d) { public void Method1() ...

  8. 移动端meta标签整理-备

    分类 在介绍移动端特有 meta 标签之前,先简单说一下 HTML meta 标签的一些知识. meta 标签包含了 HTTP 标题信息 (http-equiv) 和 页面描述信息 (name). h ...

  9. 【测试】解决loadrunner11无法运行负载测试

    问题: LoadRunner11版,录制完脚本,准备运行时提示‘ loadrunner controller 无法创建 vuser 确保您的 load generator ’, 脚本已经录好,但是运行 ...

  10. 如何为企业选择最理想的Linux服务器系统?

    [2013年10月12日 51CTO外电头条]什么样的Linux服务器最合适您的企业?简言之,它需要为员工带来工作所需的理想支持效果. 相对于成百上千种Linux桌面系统,Linux服务器系统的数量其 ...