HTML小游戏

可怜白发生 2009-05-17 04:38:25

HTML小游戏：



<html>



<head>

<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<title>真实界 / True Life</title>





<script type="text/javascript">



var xr_x = 536;

var xr_y = 197;



var xr_next_x = xr_x;

var xr_next_y = xr_y;



var dest_step_max = 50;

var dest_step = 0;



var scene_id = 1;







function xr_move()

{

   var x, y;



   switch (scene_id) {

   case 1:

       if ((Math.abs(xr_x - 345) < 15) && (Math.abs(xr_y - 172) < 15)) {

	   document.getElementById("bg").src="http://j.99081.com/lugt/bg_002.jpg";

	   scene_id = 2;

	   xr_x = 448;

	   xr_y = 197;

	   xr_next_x = xr_x;

	   xr_next_y = xr_y;

       } else if ((Math.abs(xr_x - 267) < 15) && (Math.abs(xr_y - 105) < 15)) {

	   document.getElementById("bg").src="http://j.99081.com/lugt/bg_003.jpg";

	   scene_id = 3;

	   xr_x = 163;

	   xr_y = 205;

	   xr_next_x = xr_x;

	   xr_next_y = xr_y;

       }

       break;

   case 2:

       if ((Math.abs(xr_x - 29) < 15) && (Math.abs(xr_y - 504) < 15)) {

	   document.getElementById("bg").src="http://j.99081.com/lugt/bg_001.jng";

	   scene_id = 1;

	   xr_x = 536;

	   xr_y = 197;

	   xr_next_x = xr_x;

	   xr_next_y = xr_y;

       }

       break;

   case 3:

       if ((Math.abs(xr_x - 29) < 15) && (Math.abs(xr_y - 504) < 15)) {

	   document.getElementById("bg").src="http://j.99081.com/lugt/bg_001.jng";

	   scene_id = 1;

	   xr_x = 536;

	   xr_y = 197;

	   xr_next_x = xr_x;

	   xr_next_y = xr_y;

       }

       break;

   }





   if (xr_x == xr_next_x) {

      // do nothing

   } else if (xr_x < xr_next_x) {

      xr_x = xr_x + 1;

   } else {

      xr_x = xr_x - 1;

   }



   if (xr_y == xr_next_y) {

      // do nothing

   } else if (xr_y < xr_next_y) {

      xr_y = xr_y + 1;

   } else {

      xr_y = xr_y - 1;

   }



   document.getElementById("XiaoRen").style.left = xr_x;

   document.getElementById("XiaoRen").style.top = xr_y;



   debug_info("x=" + xr_x + ", xr_y=" + xr_y);



}



function move_here(e)

{

   xr_next_x = e.clientX - 20;

   xr_next_y = e.clientY - 20;



   dest_step = dest_step_max;

   document.getElementById("xr_Dest").style.display = '';

   document.getElementById("xr_Dest").style.left = xr_next_x;

   document.getElementById("xr_Dest").style.top = xr_next_y;

}



function debug_info(message)

{

    document.getElementById("debug_info").innerHTML = message;

}



function window_timer()

{

//alert(document.getElementById("XiaoRen"));



//debug_info("aaa");



    xr_move();



    if (dest_step != 0) {

        dest_step--;

        if (dest_step == 0) {

            document.getElementById("xr_Dest").style.display = 'none';

            document.getElementById("xr_Dest").style.MozOpacity = 1.0;

        } else {

	    document.getElementById("xr_Dest").style.MozOpacity = dest_step / dest_step_max;

	}

    }

}



window.setInterval("window_timer()", 10);





</script>



</head>







<body style="background-color:#606060;" onmousedown="move_here(event);">

<img id="bg" src="img/bg_001.png">



<div id="debug_info" style="position:absolute; left:0px; top:0px; width:500px; height:30px; border:1px solid #c00000; background-color:#ffffff; display:none;">tmd!</div>



<img id="XiaoRen" src="http://j.99081.com/lugt/xr_face_happy.png" style="position:absolute; left:100px; top:100px;">



<img id="xr_Dest" src="http://j.99081.com/lugt/dest.png" style="position:absolute; left:100px; top:100px;display:none; -moz-opacity:1;">





</body>







</html>

...全文

216 4 打赏收藏转发到动态举报

写回复

用AI写文章

4 条回复

切换为时间正序

请发表友善的回复…

发表回复

outou 2009-05-18

打赏
举报

学习，收藏

哆啦A木 2009-05-18

打赏
举报

免费10G全能空间/ASP和PHP自由选择/无限流量/可绑域名/送MYSQL数据库/

1\ASP和PHP自由选择
2\支持MYSQL，ACCESS
3\支持FTP软件
4\提供免费二级域名
5\提供域名绑定服务
6\不限流量
7\上传速度快为100K-500K
8\页面测试打开速度为0.01S (0.01秒)
9\无广告无限制免审核

申请地址: http://www.yaokj.com

推荐人：muguku

lopos1 2009-05-17