Skip to content

Commit 58e6ec8

Browse files
SumyChoSumyCho
committed
九宫格抽奖 提交
0 parents  commit 58e6ec8

File tree

7 files changed

+145
-0
lines changed

7 files changed

+145
-0
lines changed

‎squareprize/data.json

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"status":1,
3+
"data":{
4+
"prize_id":5,
5+
"prize_name":"1000 Lucky",
6+
"prize_site":5
7+
}
8+
9+
}

‎squareprize/images/1.png

44.9 KB
Loading

‎squareprize/index.html

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>正方形抽奖</title>
5+
<style>
6+
.active{background: #000;}
7+
</style>
8+
</head>
9+
<body>
10+
<div id="lottery">
11+
<table border="0" cellpadding="0" cellspacing="0">
12+
<tr>
13+
<td class="lottery-unit lottery-unit-0"><img src="images/1.png"></td>
14+
<td class="lottery-unit lottery-unit-1"><img src="images/1.png"></td>
15+
<td class="lottery-unit lottery-unit-2"><img src="images/1.png"></td>
16+
<td class="lottery-unit lottery-unit-3"><img src="images/1.png"></td>
17+
</tr>
18+
<tr>
19+
<td class="lottery-unit lottery-unit-11"><img src="images/1.png"></td>
20+
<td colspan="2" rowspan="2" style="background: #F5DEB3;"><a href="#">click</a></td>
21+
<td class="lottery-unit lottery-unit-4"><img src="images/1.png"></td>
22+
</tr>
23+
<tr>
24+
<td class="lottery-unit lottery-unit-10"><img src="images/1.png"></td>
25+
<td class="lottery-unit lottery-unit-5"><img src="images/1.png"></td>
26+
</tr>
27+
<tr>
28+
<td class="lottery-unit lottery-unit-9"><img src="images/1.png"></td>
29+
<td class="lottery-unit lottery-unit-8"><img src="images/1.png"></td>
30+
<td class="lottery-unit lottery-unit-7"><img src="images/1.png"></td>
31+
<td class="lottery-unit lottery-unit-6"><img src="images/1.png"></td>
32+
</tr>
33+
</table>
34+
</div>
35+
<script src="jquery-3.1.1.min.js"></script>
36+
<script src="prize.js"></script>
37+
<script src="index.js"></script>
38+
</body>
39+
</html>

‎squareprize/index.js

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
2+
function roll(){
3+
lottery.times += 1;
4+
lottery.roll();
5+
if (lottery.times > lottery.cycle+10 && lottery.prize==lottery.index) {
6+
clearTimeout(lottery.timer);
7+
lottery.prize=-1;
8+
lottery.times=0;
9+
click=false;
10+
}else{
11+
if (lottery.times<lottery.cycle) {
12+
lottery.speed -= 10;
13+
14+
}else if(lottery.times==lottery.cycle) {
15+
var index = $("#lottery").attr("prize_id")|0;
16+
lottery.prize = index;
17+
}else{
18+
if (lottery.times > lottery.cycle+10 && ((lottery.prize==0 && lottery.index==7) || lottery.prize==lottery.index+1)) {
19+
lottery.speed += 110;
20+
}else{
21+
lottery.speed += 20;
22+
}
23+
}
24+
if (lottery.speed<40) {
25+
lottery.speed=40;
26+
};
27+
//console.log(lottery.times+'^^^^^^'+lottery.speed+'^^^^^^^'+lottery.prize);
28+
lottery.timer = setTimeout(roll,lottery.speed);
29+
}
30+
return false;
31+
}
32+
33+
$(function() {
34+
var click = false;
35+
lottery.init('lottery');
36+
$("#lottery a").click(function() {
37+
if (click) {
38+
return false;
39+
}else{
40+
click = true;
41+
lottery.speed = 100;
42+
$.ajax({
43+
type: "get",
44+
dataType: "json",
45+
data: {uid: 1},
46+
url: "data.json",
47+
success: function(data){
48+
$("#lottery").attr("prize_site", data.data.prize_site);
49+
$("#lottery").attr("prize_id", data.data.prize_id);
50+
$("#lottery").attr("prize_name", data.data.prize_name);
51+
roll();
52+
click = false;
53+
return false;
54+
}
55+
});
56+
}
57+
})
58+
});

‎squareprize/jquery-3.1.1.min.js

Lines changed: 4 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎squareprize/prize.js

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
var lottery = {
2+
index: 0, //当前转动到哪个位置，起点位置
3+
count: 0, //总共有多少个位置
4+
timer: 0, //setTimeout的ID，用clearTimeout清除
5+
speed: 20, //初始转动速度
6+
times: 2, //转动次数
7+
cycle: 50, //转动基本次数：即至少需要转动多少次再进入抽奖环节
8+
prize: 0, //中奖位置
9+
init: function(id) {
10+
if ($("#" + id).find(".lottery-unit").length > 0) {
11+
$lottery = $("#" + id);
12+
$units = $lottery.find(".lottery-unit");
13+
this.obj = $lottery;
14+
this.count = $units.length;
15+
$lottery.find(".lottery-unit-" + this.index).addClass("active");
16+
}
17+
},
18+
roll: function() {
19+
var index = this.index;
20+
var count = this.count;
21+
var lottery = this.obj;
22+
$(lottery).find(".lottery-unit-" + index).removeClass("active");
23+
index += 1;
24+
if (index > count - 1) {
25+
index = 0;
26+
}
27+
$(lottery).find(".lottery-unit-" + index).addClass("active");
28+
this.index = index;
29+
return false;
30+
},
31+
stop: function(index) {
32+
this.prize = index;
33+
return false;
34+
}
35+
};

‎squareprize/正方形抽奖.md

Whitespace-only changes.

0 commit comments

Comments
 (0)