AI game creator

Click here for free DL of the app version that can save data.

No:38881

←

Prev Next

→

Rocket league
Developer User17403｜Date and time 24/1/26 4:00:51
Build time 20.506 sec｜Game capacity 3.322KB｜

Script

Score: 0

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
  <title>Rocket League Game</title>
  <style>
    body {
      text-align: center;
      padding-top: 50px;
      background-color: #f1f1f1;
    }
    #game-container {
      width: 400px;
      margin: 0 auto;
    }
    #rocket {
      width: 50px;
      height: 50px;
      position: absolute;
      bottom: 0;
      left: 175px;
      background-color: #FFD700;
    }
    #ball {
      width: 30px;
      height: 30px;
      position: absolute;
      top: 100px;
      left: 185px;
      background-color: #FF453A;
      border-radius: 50%;
    }
    #score-container {
      margin-top: 20px;
      font-weight: bold;
      font-size: 20px;
    }
  </style>
</head>
<body>
  <div id="game-container">
    <div id="rocket"></div>
    <div id="ball"></div>
  </div>
  <div id="score-container">Score: 0</div>

// Get necessary DOM elements
    var rocket = document.getElementById('rocket');
    var ball = document.getElementById('ball');
    var scoreContainer = document.getElementById('score-container');

// Handle user input
    function handleTouchStart(event) {
      var touchX = event.touches[0].clientX;
      var rocketX = rocket.getBoundingClientRect().left;
      if (touchX < rocketX) {
        moveRocket(-rocketSpeed);
      } else if (touchX > rocketX + rocket.offsetWidth) {
        moveRocket(rocketSpeed);
      }
    }

// Move the rocket
    function moveRocket(speed) {
      var rocketX = rocket.getBoundingClientRect().left;
      var gameContainerWidth = document.getElementById('game-container').offsetWidth;
      if (rocketX + speed >= 0 && rocketX + rocket.offsetWidth + speed <= gameContainerWidth) {
        rocket.style.left = rocketX + speed + 'px';
      }
    }

// Update the ball's position
    function updateBallPosition() {
      var ballY = ball.getBoundingClientRect().top;
      if (ballY + ballSpeed <= 0) {
        resetBall();
        increaseScore();
      } else {
        ball.style.top = ballY + ballSpeed + 'px';
      }
    }

// Check for collision and reset ball's position if necessary
    function checkCollision() {
      var rocketX = rocket.getBoundingClientRect().left;
      var rocketY = rocket.getBoundingClientRect().top;
      var ballX = ball.getBoundingClientRect().left;
      var ballY = ball.getBoundingClientRect().top;
      var ballWidth = ball.offsetWidth;
      var ballHeight = ball.offsetHeight;
      if (
        ballX + ballWidth >= rocketX &&
        ballX <= rocketX + rocket.offsetWidth &&
        ballY + ballHeight >= rocketY &&
        ballY <= rocketY + rocket.offsetHeight
      ) {
        resetBall();
      }
    }

// Reset ball to starting position
    function resetBall() {
      ball.style.top = '100px';
    }

// Increase score and update score container
    function increaseScore() {
      score++;
      scoreContainer.innerHTML = 'Score: ' + score;
    }

// Start the game
    function startGame() {
      document.addEventListener('touchstart', handleTouchStart);
      setInterval(updateBallPosition, 10);
      setInterval(checkCollision, 10);
    }

// Call the startGame function to begin the game
    startGame();
  </script>
</body>
</html>