Drop a letter from the top, enter a letter on the keyboard, and pass it correctly. The next letter is incorrect.
I know several key things when I write this game.
1. onkeydown event, when the mouse is pressed
2. For the onclick event, click
3. var a = (Math. random () * 500 );
Math. random () randomly generates 0-1 decimal places
4. String. fromCharCode (65 + (a * 100) % 26)
Convert a number to a char letter
5. event. keyCode
The value corresponding to the key pressed by the keyboard.
String. fromCharCode (event. keyCode)
6. setTimeout ("setHeight ()", 20 );
The number of millimeters per call .. Method
As long as you know about these games, the js games are basically the same.
---------------------- The following is my source code, which contains jquery, but the selector is used, so you don't need to thank document. getElementById (), others are useless -------------
<Html>
<Head>
<Title>
Test
</Title>
<Style>
Td {
Width: 70px;
Border: 10px double
}
. Tr1 {
Background: # eeeeee
}
. Td1 {
Background: # ff0000
}
. Gamediv1 {
Background: # eeeeee;
Height: 400px;
Width: 600px;
Background-image: url ("216915w224.jpg ");
}
. Box {
Background: # aa9900;
Height: 30px;
Width: 30px;
Text-align: center
}
</Style>
</Head>
<Script src = "jquery-1.4.2.js"> </script>
<Script>
$ (Document). ready (function (){
$ ("Tr"). hover (
Function (){
$ (This). addClass ("tr1 ");
},
Function (){
$ (This). removeClass ("tr1 ");
}
);
$ ("Td"). hover (
Function (){
$ (This). addClass ("td1 ");
},
Function (){
$ (This). removeClass ("td1 ");
}
);
});
Function load (){
$ ("# S"). fadeIn ("slow ");
}
Function show (){
$ ("# S"). fadeIn ("slow ");
}
Function out (){
$ ("# S"). fadeOut ("slow ");
}
Var zimu;
Var height;
Var width;
Var rightcount = 0;
Var errcount = 0;
Function startGame (){
Var c = createob ();
Zimu = c;
Var a = (Math. random () * 500 );
Width =;
Height = 20;
SetHeight ();
// SetTimeout (startGame, 1000 );
// $ ("# Div1"). keydown = checkob (c );
}
Function restartGame (){
Rightcount = 0;
Errcount = 0;
Var c = createob ();
Zimu = c;
Var a = (Math. random () * 500 );
Width =;
Height = 20;
SetHeight ();
// SetTimeout (startGame, 1000 );
// $ ("# Div1"). keydown = checkob (c );
}
Function createob (){
Var B = 'a ';
Var a = Math. random ();
Return String. fromCharCode (65 + (a * 100) % 26 );
}
Function checkob (){
If (zimu = String. fromCharCode (event. keyCode )){
$ ("# Div1"). attr ("innerHTML ","");
Rightcount + = 1;
StartGame ();
} Else {
Errcount + = 1
StartGame ();
}
}
Function setHeight (){
Var square = "<div class = 'box' STYLE = 'position: relative; left:" + width + "px; top:" + height + "px; '> "+ zimu +" <div> ";
$ ("# Div1"). attr ("innerHTML", square );
Height + = 1;
If (errcount> 2 ){
Var square = "<div class = 'box' STYLE = 'position: relative; left:" + 200 + "px; top:" + 100 + "px; font: italic normal bolder 19pt Arial '> "+" game end answer: "+ rightcount +" <div> ";
$ ("# Div1"). attr ("innerHTML", square );
} Else {
If (height <= 300 ){
SetTimeout ("setHeight ()", 20 );
} Else {
StartGame ();
}
}
}
</Script>
<Body onload = "load ()" onkeydown = "checkob ()">
<Input type = "button" onclick = "show ()" id = "show" value = "show"/>
<Input type = "button" onclick = "out ()" id = "out" value = "Remove"/>
<Table id = "s">
<Tr>
<Td> sdf </td>
<Td> asdf </td>
<Td> sdfa </td>
<Td> asdf </td>
</Tr>
<Tr>
<Td> asdf </td>
<Td> asdf </td>
<Td> asdgf </td>
<Td> 1 asdf </td>
</Tr>
<Tr>
<Td> asdf </td>
<Td> sdf </td>
<Td> sdf </td>
<Td> sadf </td>
</Tr>
<Tr>
<Td> asdf </td>
<Td> asdf </td>
<Td> asdf </td>
<Td> asdf </td>
</Tr>
</Table>
<Input type = "button" onclick = "startGame ()" id = "out2" value = "start"/>
<Input type = "button" onclick = "restartGame ()" id = "out3" value = "Start again"/>
<Div id = "div1" class = "gamediv1" onkeydown = "checkob ()">
</Div>
<Div id = "div2"> </div>
</Body>
</Html>