免费注册 查看新帖 |

Chinaunix

  平台 论坛 博客 文库
最近访问板块 发新帖
查看: 2299 | 回复: 0

PHP幸运大转盘源码,支持ThinkPHP [复制链接]

论坛徽章:
0
发表于 2015-07-14 10:05 |显示全部楼层
可以看到1-6等奖都只有1个 ,7等奖有6个。指针默认指向上图位置,记为0°。

每个奖项对应不同的角度,圆的角度为360°,分成12块,所以每块为30°。

为了防止指针指着相邻两个将向之间的线,所以记为一等奖的最小角度为1°,最大角度为29°。同理可找出其他奖项的角度,这要注意,七等奖有6个。

然后呢,每个奖项都有不同的中奖概率,我们根据概率来获取奖项(概率可以设置为0,你懂的~),获取奖品后,在根据最大和最小角度生成一个随机数,来让指针旋转即可..

1.png

[PHP]代码
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="keywords" content="幸运大转盘,cnsecer.com" />
  6. <meta name="description" content="幸运大转盘" />
  7. <title>幸运大转盘</title>
  8. <style type="text/css">
  9. .demo{width:417px; height:417px; position:relative; margin:50px auto}
  10. #disk{width:417px; height:417px; background:url(__STATIC__/images/disk.jpg) no-repeat}
  11. #start{width:163px; height:320px; position:absolute; top:46px; left:130px;}
  12. #start img{cursor:pointer}
  13. </style>
  14. <script src="http://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
  15. <script type="text/javascript" src="__STATIC__/js/jQueryRotate.2.2.js"></script>
  16. <script type="text/javascript" src="__STATIC__/js/jquery.easing.min.js"></script>
  17. <script type="text/javascript">


  18. $(function(){
  19.      $("#startbtn").click(function(){
  20.         lottery();
  21.     });
  22. });
  23. function lottery(){
  24.     $.ajax({
  25.         type: 'POST',
  26.         url: '{:U(\'game/run\')}',  //提交地址 改为你自己的
  27.         dataType: 'json',
  28.         cache: false,
  29.         error: function(){
  30.             alert('出错了!');
  31.             return false;
  32.         },
  33.         success:function(json){
  34.             $("#startbtn").unbind('click').css("cursor","default");
  35.             var a = json.angle; //角度
  36.             var p = json.prize; //奖项
  37.             $("#startbtn").rotate({
  38.                 duration:3000, //转动时间
  39.                 angle: 0,
  40.                 animateTo:1800+a, //转动角度
  41.                 easing: $.easing.easeOutSine,
  42.                 callback: function(){
  43.                     var con = confirm('恭喜你,中得'+p+'\n还要再来一次吗?');
  44.                     if(con){
  45.                         lottery();
  46.                     }else{
  47.                         return false;
  48.                     }
  49.                 }
  50.             });
  51.         }
  52.     });
  53. }

  54. </script>
  55. </head>

  56. <body>

  57. <div id="main">
  58.    <div class="msg"></div>
  59.    <div class="demo">
  60.         <div id="disk"></div>
  61.         <div id="start"><img src="__STATIC__/images/start.png" id="startbtn"></div>
  62.    </div>
  63. </div>


  64. <div id="footer">
  65. </div>

  66. </body>
  67. </html>
复制代码
您需要登录后才可以回帖 登录 | 注册

本版积分规则 发表回复

  

北京盛拓优讯信息技术有限公司. 版权所有 京ICP备16024965号-6 北京市公安局海淀分局网监中心备案编号:11010802020122 niuxiaotong@pcpop.com 17352615567
未成年举报专区
中国互联网协会会员  联系我们:huangweiwei@itpub.net
感谢所有关心和支持过ChinaUnix的朋友们 转载本站内容请注明原作者名及出处

清除 Cookies - ChinaUnix - Archiver - WAP - TOP