This article describes the implementation of a large turntable lottery game in js. Share it for your reference. The specific implementation method is as follows:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http:///TR/xhtml1/DTD/">
<html xmlns="http:///1999/xhtml">
<head>
<title>jslottery</title>
<style type="text/css">
td{width:50px;height:50px;border:3px solid #ccc;text-align:center;vertical-align:middle}
</style>
</head>
<body>
<table >
<tr>
<td>1</td><td>2</td><td>3</td><td>4</td><td>5</td>
</tr>
<tr>
<td>16</td><td></td><td></td><td></td><td>6</td>
</tr>
<tr>
<td>15</td><td></td><td></td><td></td><td>7</td>
</tr>
<tr>
<td>14</td><td></td><td></td><td></td><td>8</td>
</tr>
<tr>
<td>13</td><td>12</td><td>11</td><td>10</td><td>9</td>
</tr>
</table>
<p></p>
Please enter1-16One of the integers，Represents the location to stop<input value="12" type="text" /><input type="button" value="start" onclick="StartGame()" />
<script type="text/javascript">
/*
* Delete spaces on both left and right ends
*/
function Trim(str){
return (/(^\s*)|(\s*$)/g, "");
}
/*
* Define an array
*/
function GetSide(m,n){
//Initialize the array var arr = [];
for(var i=0;i<m;i++){
([]);
for(var j=0;j<n;j++){
arr[i][j]=i*n+j;
}
}
//Get the outermost circle of the array var resultArr=[];
var tempX=0,
tempY=0,
direction="Along",
count=0;
while(tempX>=0 && tempX<n && tempY>=0 && tempY<m && count<m*n)
{
count++;
([tempY,tempX]);
if(direction=="Along"){
if(tempX==n-1)
tempY++;
else
tempX++;
if(tempX==n-1&&tempY==m-1)
direction="Inverse"
}
else{
if(tempX==0)
tempY--;
else
tempX--;
if(tempX==0&&tempY==0)
break;
}
}
return resultArr;
}
var index=0, //The current bright area location prevIndex=0, //The previous position Speed=300, //Initial speed Time, //Define the object arr = GetSide(5,5), //Initialize the array EndIndex=0, //Decide which grid is slower tb = ("tb"), //Get tb object cycle=0, //Number of rotation EndCycle=0, //Calculate the number of circles flag=false, //End rotation sign quick=0; //accelerate function StartGame(){
cycle=0;
flag=false;
EndIndex=(()*16);
//EndCycle=(()*4);
EndCycle=1;
Time = setInterval(Star,Speed);
}
function Star(num){
//The marionette speed change if(flag==false){
//Start to speed up by walking the five grids if(quick==5){
clearInterval(Time);
Speed=50;
Time=setInterval(Star,Speed);
}
//Slow down after running N laps if(cycle==EndCycle+1 && index==EndIndex){
clearInterval(Time);
Speed=300;
flag=true; //Trigger ends Time=setInterval(Star,Speed);
}
}
if(index>=){
index=0;
cycle++;
}
//End the rotation and select the number if(flag==true && index==parseInt(Trim(("txtnum").value))-1){
quick=0;
clearInterval(Time);
}
[arr[index][0]].cells[arr[index][1]].="3px solid red";
if(index>0)
prevIndex=index-1;
else{
prevIndex=-1;
}
[arr[prevIndex][0]].cells[arr[prevIndex][1]].="3px solid #ccc";
index++;
quick++;
}
/*
=function(){
Time = setInterval(Star,Speed);
}
*/
</script>
</body>
</html>
I hope this article will be helpful to everyone's JavaScript programming.