JS实现简易的坦克发射(发射子弹)

JavaScript010

JS实现简易的坦克发射(发射子弹),第1张

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title>键盘事件和组合键</title>

<style>

    *{

        margin: 0

        padding: 0

    }

    #div1{width:40px

        height:40px

        position:absolute

        background:url(tank.png)

        background-size:100%

        /* background:orange*/

        transform:rotate(0deg)

    }

    .pd{

        width:5px

        height:15px

        border-radius:50%

        position:absolute

        background:#f06

    }       

</style>

</head>

<body>

    <div id="div1" style="top:350pxleft:100pxposition: relative"></div>

</body>

</html>

<script>

    //要求 : 按住键盘的上下左右箭头  控制div的移动 

    // 按住 空格键  创建子弹 并发射子弹

    //37 39 32

    var div1 = document.getElementById("div1")

    document.onkeydown = function(eve){ //创建一个键盘事件

        var left = parseInt(div1.style.left)//获取div1距离页面左边的距离

        var top = parseInt(div1.style.top)//获取div1距离页面顶部的距离

        var e = eve||event

        if(e.keyCode==39){//点击方向右键向右移动,keyCode判断键盘按了哪个键

          div1.style.left=left+10+"px"

        }else if(e.keyCode==37){//左键向左移动

            div1.style.left=left-10+"px"

        }else if(e.keyCode==38){//向上移动

          div1.style.top=top-10+"px"

        }

        else if(e.keyCode==40){//向下移动

          div1.style.top=top+10+"px"

        }

        else if(e.keyCode == 32){

            var span =document.createElement("span")//创建一个span标签作为子弹

            document.body.insertBefore(span,div1)//将span标签插入body中的div前面

            var j = parseInt(div1.style.left)//获取div1距离页面左边的距离

            var k = parseInt(div1.style.top)-12//获取div1距离页面顶部的距离

            span.style.cssText="background:greendisplay:blockwidth:6pxheight:10pxborder-radius:50%position:absolutetop:kpxleft:j+18pxz-index:1"

            span.style.left = j+18+"px"//让span在div的中间位置出现

            span.style.top = k+"px"

            var i = k

            setInterval(function(){ //设置定时器每隔25ms,子弹做一次移动,每次移动10px

                // var a = parseInt(span.style.top)

                    i = i-10

                  span.style.top = i+"px"

                //    span.style.top = i+"px"

                  if(i<0){

                      span.remove()//当子弹超出屏幕,删除这个span节点

                  }

            },25)

        }

    }

</script>

《绝地求生大逃杀》分子弹的方法是:打开自己的背包,确认有子弹,然后摁shift键拉着所要分的子弹往外拖即可。

《绝地求生》(Playerunknown's Battlegrounds),是Bluehole与《H1Z1》、《武装突袭3》“大逃杀”模式制作人Playerunknown合作的一款开放世界策略射击游戏,采用虚幻4引擎制作。这款游戏是一款大逃杀类型的游戏,每一局游戏将有100名玩家参与,他们将被投放在绝地岛(battlegrounds)上,在游戏的开始时所有人都一无所有。玩家需要在岛上收集各种资源,对抗其他玩家,让自己生存到最后。

游戏中若是队友资源不够用可以分给他们,分资源的方法是:打开背包,摁下shift键拉着物品往外拖,随后会发现身边有个物品箱,里面既是所要分的物品。

按住tab打开背包,然后松开tab键显示背包页面,然后按住ctrl,选中你要分发的子弹,鼠标点击拖出格子外,会显示数量,输入对应的数量,即可把对应数量的子弹,扔到地上,队友捡起来就可以了。