可以看到1-6等奖都只有1个,7等奖有6个。指针默认指向上图位置,记为0°。 每个奖项对应不同的角度,圆的角度为360°,分成12块,所以每块为30°。 为了防止指针指着相邻两个将向之间的线,所以记为一等奖的最小角度为1°,最大角度为29°。同理可找出其他奖
可以看到1-6等奖都只有1个 ,7等奖有6个。指针默认指向上图位置,记为0°。
每个奖项对应不同的角度,圆的角度为360°,分成12块,所以每块为30°。
为了防止指针指着相邻两个将向之间的线,所以记为一等奖的最小角度为1°,最大角度为29°。同理可找出其他奖项的角度,这要注意,七等奖有6个。
然后呢,每个奖项都有不同的中奖概率,我们根据概率来获取奖项(概率可以设置为0,你懂的~),获取奖品后,在根据最大和最小角度生成一个随机数,来让指针旋转即可..
全部代码在:http://www.cnsecer.com/7831.html ThinkPHP

<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name="keywords" content="幸运大转盘,cnsecer.com" /> <meta name="description" content="幸运大转盘" /> <title>幸运大转盘</title> <style type="text/css"> .demo{width:417px; height:417px; position:relative; margin:50px auto} #disk{width:417px; height:417px; background:url(__STATIC__/images/disk.jpg) no-repeat} #start{width:163px; height:320px; position:absolute; top:46px; left:130px;} #start img{cursor:pointer} </style> <script src="http://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript" src="__STATIC__/js/jQueryRotate.2.2.js"></script> <script type="text/javascript" src="__STATIC__/js/jquery.easing.min.js"></script> <script type="text/javascript"> $(function(){ $("#startbtn").click(function(){ lottery(); }); }); function lottery(){ $.ajax({ type: 'POST', url: '{:U(\'game/run\')}', //提交地址 改为你自己的 dataType: 'json', cache: false, error: function(){ alert('出错了!'); return false; }, success:function(json){ $("#startbtn").unbind('click').css("cursor","default"); var a = json.angle; //角度 var p = json.prize; //奖项 $("#startbtn").rotate({ duration:3000, //转动时间 angle: 0, animateTo:1800+a, //转动角度 easing: $.easing.easeOutSine, callback: function(){ var con = confirm('恭喜你,中得'+p+'\n还要再来一次吗?'); if(con){ lottery(); }else{ return false; } } }); } }); } </script> </head> <body> <div id="main"> <div class="msg"></div> <div class="demo"> <div id="disk"></div> <div id="start"><img src="/static/imghwm/default1.png" data-src="__STATIC__/images/start.png" class="lazy" id="startbtn" alt="PHP幸运大转盘源码,支持ThinkPHP" ></div> </div> </div> <div id="footer"> </div> </body> </html>
Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

AI Hentai Generator
Generate AI Hentai for free.

Hot Article
R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
4 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Best Graphic Settings
4 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
Assassin's Creed Shadows: Seashell Riddle Solution
2 weeks agoByDDD
R.E.P.O. How to Fix Audio if You Can't Hear Anyone
4 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: How To Unlock Everything In MyRise
1 months agoBy尊渡假赌尊渡假赌尊渡假赌

Hot Tools

PhpStorm Mac version
The latest (2018.2.1) professional PHP integrated development tool

SublimeText3 English version
Recommended: Win version, supports code prompts!

WebStorm Mac version
Useful JavaScript development tools

SAP NetWeaver Server Adapter for Eclipse
Integrate Eclipse with SAP NetWeaver application server.

Zend Studio 13.0.1
Powerful PHP integrated development environment