■2008年04月15日◇座標軸によるMAPの表示30×30マスの中で、現在地を含む5×5マスのフィールドを表示するプログラム。
■は座標外、□は座標内を表します。
移動すると座標が変わっていきます。
イベント判定・壁判定など何もしていませんが、概念・作り方はなんとなくわかりました。
//座標軸
$x = $_POST["x"];
$y = $_POST["y"];
$za = $_POST["za"];
//デフォルト表示（本番では消す）
if($x==""){
$x=10;
}
if($y==""){
$y=10;
}
//
$xx=$x;
$yy=$y;
//行動する
if($za==1){
//↑
$yy=$y+1;
}
if($za==2){
//↓
$yy=$y-1;
}
if($za==3){
//←
$xx=$x-1;
}
if($za==4){
//→
$xx=$x+1;
}
//該当座標の移動の確認
$x=$xx;
$y=$yy;
//ここに関数を入れて移動可能か判定する
$x_s = $x - 2;
$x_e = $x + 2;
$y_s = $y + 2;
$y_e = $y - 2;
print "<table>";
//現在の座標
$zahyou=0;
//全MAPを表示する
for($i=$y_s;$i>=$y_e;$i--){
print "<tr>";
for($j=$x_s;$j<=$x_e;$j++){
print "<td>";
if($i<1 || $j<1 || $i>30 ||$j>30){
$locate = "■($i,$j) ";
}
else{
$locate = "□($i,$j) ";
}
print $locate;
print "</td>";
}
print "</tr>";
}
print "</table>";
print "<table><tr>";
print "<td>";
print "<form method="post" action="main.php#field">";
print "<input type=submit name="" value="↑">";
print "<input type=hidden name="za" value="1">";
print "<input type=hidden name="x" value="$x">";
print "<input type=hidden name="y" value="$y">";
print "</form>";
print "</td><td>";
print "<form method="post" action="main.php#field">";
print "<input type=submit name="" value="↓">";
print "<input type=hidden name="za" value="2">";
print "<input type=hidden name="x" value="$x">";
print "<input type=hidden name="y" value="$y">";
print "</form>";
print "</td><td>";
print "<form method="post" action="main.php#field">";
print "<input type=submit name="" value="←">";
print "<input type=hidden name="za" value="3">";
print "<input type=hidden name="x" value="$x">";
print "<input type=hidden name="y" value="$y">";
print "</form>";
print "</td><td>";
print "<form method="post" action="main.php#field">";
print "<input type=submit name="" value="→">";
print "<input type=hidden name="za" value="4">";
print "<input type=hidden name="x" value="$x">";
print "<input type=hidden name="y" value="$y">";
print "</form>";
print "</td></tr></table>";
実行結果
■2008年04月13日◇画像の重ね合わせテーブルのTD要素の背景に画像を設定し、更に普通に画像を表示させると画像を2つ重ねさわせることが出来ます。
＞HTML
<td class="mati" width="10" height="25"><INPUT TYPE="image" src="test.gif" VALUE="submit" alt="" border="0" OnClick="popup()"></td>
＞スタイルシート
TD.mati {
background-image:url('test.png');
}
