大转盘游戏

最新推荐文章于 2024-11-03 10:21:12 发布

爱思特儿

最新推荐文章于 2024-11-03 10:21:12 发布

阅读量555

点赞数 1

分类专栏：游戏文章标签：大转盘游戏 html css jquery

本文链接：https://blog.csdn.net/JXEstelle/article/details/53909758

版权

游戏专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<style type="text/css" media="screen">
.bg-light{
width: 400px;
height: 400px;
background: url(img/ly-plate-c.gif) no-repeat;
margin: 0 auto;
position: relative;
}
.bg-lottery{
width: 340px;
height: 340px;
background: url(img/bg-lottery.png) no-repeat;
margin: 0 auto;
position: absolute;
left: 50%;
top:50%;
margin-left: -170px;
margin-top: -170px;
}
.playbtn{
position: absolute;
width: 186px;
height: 186px;
background: url(img/playbtn.png) no-repeat;
left: 50%;
top:50%;
margin-left: -93px;
margin-top: -93px;
cursor: pointer;
}
</style>
<script src="js/jquery.min.js"></script>


</head>
<body>
<div class="bg-light">
<img src="img/bg-lottery.png" class="bg-lottery">
<img src="img/playbtn.png" alt="" class="playbtn">
</div>
<script src="js/jquery.rotate.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var $btn = $('.playbtn');//按钮
var playnum = 6; //初始次数，由后台传入
var isture = 0;
var clickfunc = function() {
var data = [1, 2, 3, 4, 5, 6];
//data为随机出来的结果，根据概率后的结果
data = data[Math.floor(Math.random() * data.length)];
switch(data) {
case 1:
rotateFunc(1, 360, '1111112000');
break;
case 2:
rotateFunc(2, 60, '666661000');
break;
case 3:
rotateFunc(3, 120, '2222谢谢');
break;
case 4:
rotateFunc(4, 180, '444444京东');
break;
case 5:
rotateFunc(5, 240, '5200');
break;
case 6:
rotateFunc(6, 300, '谢谢');
break;
}
}
$('.playbtn').click(function(){
clickfunc();
});
var rotateFunc = function(awards, angle, text) {
isture = true;
$btn.stopRotate();


$(".bg-lottery").rotate({
angle: 0,
duration: 4000, //旋转时间
animateTo: angle+1800, //让它根据得出来的结果加上1440度旋转
callback: function() {
isture = false; // 标志为 执行完毕
alert(text);
}
});
};
});
</script>
</body>
</html>