海の上を敵が動く

JavaScriptメモ

http://home.h00.itscom.net/toku/jsexample/background/background.html

<html>
<head runat="server">
<title></title>
<script src="../lib/jquery-1.4.min.js" type="text/javascript"></script>
</head>
<body onload="sampleMain()">
<script language="JavaScript">

function sampleMain() {
  var tableStr = "<center><table><tr><td>";
  for(var y = 0; y < 8; y++) {
    for(var x = 0; x < 8; x++) {
      tableStr += "<img id='img" + x + "_" + y + "' src='../img/land_0.png'>";
    }
    tableStr += "<br>";
  }
  tableStr += "</td></tr></table></center>";
  $("body").append(tableStr);

  $("body").append("<div id='div1' style='position:absolute'><img id='img1' src='../img/enemy_1_0.png'></div>");

  enemyColumn = 0;
  enemyX = 0;
  enemyY = 0;
 $("#div1").hide();

  setInterval("updateTurn()",50); 
}

function updateEnemyPosition() {
  $("#div1").css("top", $("#img0_0").offset().top + enemyY);
  $("#div1").css("left", $("#img0_0").offset().left + enemyX);
}

function updateTurn() {
  var enemyElement = $("#div1");
  updateEnemyPosition();
  if(enemyY == 0) {
    enemyElement.fadeIn();
  }
  enemyY+=4;
  if(enemyY == 32 * 7) {
    enemyElement.fadeOut();
  }
  if(enemyY == 32 * 8) {
    enemyY = 0;
    enemyX += 32;
    if(enemyX == 32 * 7) {
      enemyX = 0;
    }
  }
}
</script>
</body>
</html>