第1帖、ウェブページの版のを出して白い塊を踏んではいけません
9548 ワード
index.
init.js
どうしてテーブルをキャンバスにしますか?
理由は簡単で、ゲームの内容は正方形で、しかも並んでいて、テーブルのラベルの特徴に合っています.
コードのロードが完了したら、画布の内容を初期化して、trとtdを挿入します.trとtdはそれぞれ対応しています.四角形の行と四角形です.
その後、ブロックごとにクリックイベントを登録し、クリックして最初の行の黒いブロックかどうかを判断します.(黒いブロックはクラス＝「black」類でマークします.)
はい、最初の行を削除して新しい行を追加してゲームを続けます.
いいえ、直接ゲームを終了します.
欠陥やバグが発見されたら、フィードバックを歓迎します.本人QQ:2632790902
----初めての投稿です.ありがとうございます.
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <title> </title>
5 <script type="text/javascript" src="js/jquery.js"></script>
6 <script type="text/javascript" src="js/init.js"></script>
7 </head>
8 <body>
9 <table id="canvas" style="width:98%;height:800px;margin:0 auto"></table>
10 <p> --By: 2015/07/05</p>
11 <p> QQ：2632790902 </p>
12 </body>
13 </html>init.js
1 var canvas; // div
2
3 $(function(){
4 canvas=$("#canvas");
5 init();
6 });
7
8 /* */
9 function init()
10 {
11 canvas.html("");
12 for(var n=0;n<4;n++)
13 {
14 addLine();
15 }
16 }
17
18 /* */
19 function addLine()
20 {
21 var i=Math.round(Math.random()*100)%4;
22 var line="";
23 line+="<tr>";
24 for(var n=0;n<4;n++)
25 {
26 if(n!=i)
27 {
28 line+="<td style='border:#FFF 1px solid;width:25%;height:100px;background:#CCC;'></td>";
29 }
30 else
31 {
32 line+="<td class='black' style='border:#FFF 1px solid;width:25%;height:100px;background:#555;'></td>";
33 }
34 }
35 line+="</tr>";
36 canvas.append(line);
37 }
38
39 //
40 function removeFirst()
41 {
42 canvas.children().children().eq(0).remove();
43 }
44
45 //
46 $("td").live("click", function(){
47 var thistd=$(this);
48 if(thistd.attr("class")=="black")
49 {
50 //
51 if(thistd.parent().index()==0)
52 {
53 //
54 removeFirst();
55 addLine();
56 }
57 else
58 {
59 //
60 alert(" ");
61 init();
62 }
63 }
64 else
65 {
66 //
67 alert(" ");
68 init();
69 }
70 });どうしてテーブルをキャンバスにしますか?
理由は簡単で、ゲームの内容は正方形で、しかも並んでいて、テーブルのラベルの特徴に合っています.
コードのロードが完了したら、画布の内容を初期化して、trとtdを挿入します.trとtdはそれぞれ対応しています.四角形の行と四角形です.
その後、ブロックごとにクリックイベントを登録し、クリックして最初の行の黒いブロックかどうかを判断します.(黒いブロックはクラス＝「black」類でマークします.)
はい、最初の行を削除して新しい行を追加してゲームを続けます.
いいえ、直接ゲームを終了します.
欠陥やバグが発見されたら、フィードバックを歓迎します.本人QQ:2632790902
----初めての投稿です.ありがとうございます.