master

分支 (1)

管理

管理

master

web
/
js20230322work.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>周彬209020112</title>
		<style type="text/css">
			input{font-size:26px;margin-top: 20px;}
			body{background-image: url(images/grassland.png);}
			#mytank{position: absolute;left:10px;top:100px}
		</style>
	</head>
	<body>
		<img id="mytank" src="images/right.png"/>
		<script>
            const tank = document.getElementById("mytank");
            let x = 10;
            let y = 100;
            let direction = "right";
            document.addEventListener("keydown", (event) => {
            if (event.key === "ArrowUp") {
                y -= 10;
                tank.style.top = `${y}px`;
                direction = "up";
            } else if (event.key === "ArrowDown") {
                y += 10;
                tank.style.top = `${y}px`;
                direction = "down";
            } else if (event.key === "ArrowLeft") {
                x -= 10;
                tank.style.left = `${x}px`;
                direction = "left";
            } else if (event.key === "ArrowRight") {
                x += 10;
                tank.style.left = `${x}px`;
                direction = "right";
            }
            tank.src = `images/${direction}.png`;
            });

            document.addEventListener('contextmenu', event => {
            event.preventDefault();
            });
		</script>
	</body>
</html>