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

No:19109

A game where u ride a horse and adventure the the ..ALL
Developer User8438｜Date and time 23/10/1 20:23:36
Build time 18.883 sec｜Game capacity 4.644KB｜

Script

Sure! Here's a simple game where you ride a horse and venture through the mountains while being chased by arrows as monsters. The game will be implemented as a single HTML file and will use JavaScript. Please note that pictograms are not supported in this text-based format, but you can replace the text instructions with appropriate icons in your actual HTML file.

Horse Adventure Game

This is a basic implementation of the game using HTML, CSS, and JavaScript. You can replace the horse and arrow images (`emozi_all/game.png` and `emozi_apple.png`) with appropriate icons or images of your choice. The horse is controlled using the arrow keys, and the goal is to avoid the arrows (monsters) chasing you around the mountains. If the horse collides with an arrow, the game will display a "Game Over" alert. Please make sure to replace the image sources with your own image files and customize the game appearance as per your requirement.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Horse Adventure Game</title>
  <style>
    #game-container {
      width: 400px;
      height: 400px;
      border: 1px solid black;
      position: relative;
    }
    #horse {
      width: 60px;
      height: 60px;
      position: absolute;
    }
    #arrow {
      width: 30px;
      height: 30px;
      position: absolute;
      display: none;
    }
  </style>
</head>
<body>
  <h1>Horse Adventure Game</h1>
  <div id="game-container">
    <img src="horse_icon.png" id="horse" alt="Horse">
    <img src="arrow_icon.png" id="arrow" alt="Arrow">
  </div>

// Horse movement
    let horseX = (gameWidth - horseWidth) / 2;
    let horseY = (gameHeight - horseHeight) / 2;
    horseElement.style.left = horseX + 'px';
    horseElement.style.top = horseY + 'px';

function moveHorse(direction) {
      switch (direction) {
        case 'left':
          horseX -= 10;
          break;
        case 'right':
          horseX += 10;
          break;
        case 'up':
          horseY -= 10;
          break;
        case 'down':
          horseY += 10;
          break;
      }

// Keep the horse within the game container
      horseX = Math.min(Math.max(horseX, 0), gameWidth - horseWidth);
      horseY = Math.min(Math.max(horseY, 0), gameHeight - horseHeight);

horseElement.style.left = horseX + 'px';
      horseElement.style.top = horseY + 'px';
    }

document.addEventListener('keydown', function(event) {
      switch (event.key) {
        case 'ArrowLeft':
          moveHorse('left');
          break;
        case 'ArrowRight':
          moveHorse('right');
          break;
        case 'ArrowUp':
          moveHorse('up');
          break;
        case 'ArrowDown':
          moveHorse('down');
          break;
      }
    });

// Arrow (monster) movement
    let isArrowVisible = false;
    let arrowSpeed = 5;
    let arrowInterval = null;

function startArrowMovement() {
      arrowInterval = setInterval(function() {
        if (!isArrowVisible) {
          const randomY = Math.floor(Math.random() * (gameHeight - arrowHeight));
          arrowElement.style.left = gameWidth + 'px';
          arrowElement.style.top = randomY + 'px';
          arrowElement.style.display = 'block';
          isArrowVisible = true;
        }

let arrowX = parseInt(arrowElement.style.left);
        arrowX -= arrowSpeed;
        arrowElement.style.left = arrowX + 'px';

if (arrowX < -arrowWidth) {
          arrowElement.style.display = 'none';
          isArrowVisible = false;
        }

// Check collision with horse
        if (isColliding(horseX, horseY, horseWidth, horseHeight, arrowX, parseInt(arrowElement.style.top), arrowWidth, arrowHeight)) {
          alert('Game Over!');
          clearInterval(arrowInterval);
        }
      }, 100);
    }

function isColliding(rect1X, rect1Y, rect1Width, rect1Height, rect2X, rect2Y, rect2Width, rect2Height) {
      return rect1X < rect2X + rect2Width &&
        rect1X + rect1Width > rect2X &&
        rect1Y < rect2Y + rect2Height &&
        rect1Y + rect1Height > rect2Y;
    }

startArrowMovement();
  </script>
</body>
</html>
```

This is a basic implementation of the game using HTML, CSS, and JavaScript. You can replace the horse and arrow images (`horse_icon.png` and `arrow_icon.png`) with appropriate icons or images of your choice. The horse is controlled using the arrow keys, and the goal is to avoid the arrows (monsters) chasing you around the mountains. If the horse collides with an arrow, the game will display a "Game Over" alert.

Please make sure to replace the image sources with your own image files and customize the game appearance as per your requirement.