Jquery 数独ゲーム分析 (1) - ページレイアウト

Jquery 数独ゲーム分析 (1) - ページレイアウト_jquery

May 16, 2016 pm 06:17 PM

また、近いうちに時間が許せばhtml5に移植する予定です(仮称) 練習することも主な目的です。

body のコードは次のとおりです。ページのメインレイヤーは、サイズを制御するために使用されます。Main には、キャンバスとツールの 2 つのレイヤーが含まれており、それぞれ数独テーブルと補助情報を保持するために使用されます。ツールレイヤーには、ロゴ、レベル、レフト、タイマー、leftsg、btns、および err の 7 つのレイヤーがネストされており、ロゴ、ゲームの難易度、残りスペース数、経過時間、残りスペース数の詳細を保持するために使用されます。スペース、ボタン、エラープロンプトの情報。ツールレイヤーのスタイルは、default.css スタイルファイルに書き込まれます。 Canvas 層、level 層、lefts 層、timer 層、leftsg 層、err 層の内容は jquery 制御により動的に生成されますが、これについては後述します。

コードをコピーコードは次のとおりです:

 
<body onselectstart="return false" oncopy=" return false" oncut="return false"> 
<center>><div id="main" style="width: 720px; height: 550px;"> ;div id ="キャンバス" スタイル='幅: 540px; 高さ: 540px; 
</div> 
 div id= "ロゴ"> 
JSUKUDO 
</div> 
<div id="level"> ;div id ="lefts"> 
<div> 
</div> ="leftsg "> 
<div id="btns"> 
<input type='button' value='Easy' onclick="$(g. Canvas).gensukudo(2);$('#level').html('LEVEL:' $(this).val());"> 
<br /> 
<input type=' button' value='Medium' onclick="$(g.canvas).gensukudo(3);$('#level').html('LEVEL:' $(this).val());" > 
<br /> 
<input type='button' value='Hard' onclick="$(g.canvas).gensukudo(4);$('#level') html(' LEVEL:' $(this).val());"> 
<br /> 
<input type='button' value='Restart' style="display: none ;" onclick ="$('#SkudoTable').fadeOut(500);$('.c').each(function(){if(this.num()!=0)$(this).sempty( ).check ();});$('#SkudoTable').fadeIn(500);"> 
<br /> 
<br /> 
<b> <a href="#" onclick="$(g.canvas).unblock().block({ message: gameintruce, css: {width:'480px', border: '3px Solid #a00' } }); "> 
ゲーム紹介</a> <a href="#" onclick="$(g.canvas).unblock().block({ message: aboutgame, css: {width:'400px', border : '3px Solid #a00' } });"> 
ソフトウェアについて</a> </b> 
</div> 
<div id="err"> 
</div>
</center>