坦克游戏制作js

最新推荐文章于 2021-05-11 19:26:37 发布

原创最新推荐文章于 2021-05-11 19:26:37 发布 · 618 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #游戏制作

jquery 专栏收录该内容

4 篇文章

订阅专栏

qq:2579679536
四张图片位置。./img/up-down-left-right.jpg

<!doctype html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="Generator" content="EditPlus®">
        <meta name="Author" content="">
        <meta name="Keywords" content="">
        <meta name="Description" content="">
        <title>Document</title>
        <style type="text/css">
            img{position:relative;}
        </style>
     </head>
     <body >

     <img src="img/right.jpg" id="tank" alt="" />

     <script type="text/javascript">
    tank.style.left='0px';
        tank.style.top='0px';



        document.onkeydown=function move(e){

        var e=e||event;
        keynum=e.keyCode||e.which||e.charCode;
        //alert(keynum);
        if(keynum==39)
        {
            tank.src='img/right.jpg';
            pos=parseInt(tank.style.left);


            if(pos>1000)
            {
            rpos=pos;
            }else{
            rpos=pos+10;
            }
            tank.style.left=rpos+'px';

        }
        if(keynum==40)
        {
            tank.src='img/down.jpg';
            tank.style.top=parseInt(tank.style.top)+10+'px';

        }
        if(keynum==37)
        {
            tank.src='img/left.jpg';
            tank.style.left=parseInt(tank.style.left)-10+'px';

        }
        if(keynum==38)
        {
            tank.src='img/up.jpg';
            tank.style.top=parseInt(tank.style.top)-10+'px';

        }


        }


     </script>
     </body>
</html>