所以,我正在创造一个宇宙飞船移动并且必须避开一个火球才能获胜的游戏。但是,我希望有很多火球,并且我设法(下班后)获得了以下代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<style> img {position: absolute}</style>
<body id="body"></body>
<script>
const fireballArray = [];
function generateFireBallWithAttributes(el, attrs) {
for (var key in attrs) {el.setAttribute(key, attrs[key])}
return el}
function createFireBalls(amount){
for (let i = 0; i <= amount; i++) {
fireballArray.push(
generateFireBallWithAttributes(document.createElement("img"), {
src: "Photo/fireball.png", width: "36"}))}}
createFireBalls(7)
fireballArray.forEach((fireballElement) => {
const fallStartInterval = setInterval(function(){})
document.getElementById("body").appendChild(fireballElement)
const fireball = {x: fFireball(fireballElement.offsetWidth), y: 0}
const fireLoop = function() {
fireball.y += 1
fireballElement.style.top = fireball.y + "px"
if (fireball.y > window.innerHeight) {
fireball.x = fFireball(fireballElement.offsetWidth)
fireballElement.style.left = fireball.x + "px"
fireball.y = 0}}
fireballElement.style.left = fireball.x + "px"
let fireInterval = setInterval(fireLoop, 1000 / ((Math.random() * (125 - 75)) + 75))})
function fFireball(offset) {
return Math.floor(Math.random() * (window.innerWidth - offset))}
</script>
</html>
来源:https ://stackoverflow.com/questions/63328402/add-multiple-images-video-game-js
所以我希望有人可以尝试将这两段代码放在一起(你也可以给我另一个代码 n°1 的解决方案)。
我知道这不是一个很好的问题,但我真的需要结束这场比赛,所以如果你们中的任何人能帮助我,我将不胜感激。谢谢。
Ps:如前所述,您可以给我添加火球的另一种解决方案