chimaera's game | AI game creator

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

No:3431

3810

chimaera
Developer User3702｜Date and time 23/6/25 3:17:31
Build time 16.413 sec｜Game capacity 1.855KB｜

Score: 0

このゲームは、画面上に黄色いプレーヤーと敵が現れ、プレーヤーを操作して敵をクリックして得点を取るというゲームです。JavaScriptを含ませ、ゲームボードとしてhtmlを使って、スマホ操作に対応しています。得点は即座に反映されます。

→ 　

1　

0　

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

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

(C)2023 HisashiApp

<div id="game-board">
  <div id="player"></div>
  <div id="enemy"></div>
  <div id="score">Score: 0</div>
</div>

<style>
  #game-board {
    position: relative;
    width: 100%;
    height: 100%;
  }
  #player, #enemy {
    position: absolute;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: yellow;
  }
  #player {
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
  }
</style>

<script>
  const enemy = document.getElementById('enemy')
  const player = document.getElementById('player')
  const score = document.getElementById('score')
  
  let scorePoints = 0
  
  function onEnemyClick() {
    scorePoints++
    score.innerHTML = `Score: ${scorePoints}`
    moveEnemy()
  }
  
  function moveEnemy() {
    const randomX = Math.floor(Math.random() * (window.innerWidth - 50)) // 50 is enemy's width
    const randomY = Math.floor(Math.random() * (window.innerHeight - 50)) // 50 is enemy's height
    enemy.style.left = `${randomX}px`
    enemy.style.top = `${randomY}px`
  }
  
  enemy.addEventListener('click', onEnemyClick)
  moveEnemy()
  
  function onPlayerTouchStart(event) {
    event.preventDefault()
    const touchX = event.touches[0].clientX
    player.style.left = `${touchX}px`
  }
  
  function onPlayerTouchMove(event) {
    event.preventDefault()
    const touchX = event.touches[0].clientX
    player.style.left = `${touchX}px`
  }
  
  player.addEventListener('touchstart', onPlayerTouchStart)
  player.addEventListener('touchmove', onPlayerTouchMove)
</script>

このゲームは、画面上に黄色いプレーヤーと敵が現れ、プレーヤーを操作して敵をクリックして得点を取るというゲームです。JavaScriptを含ませ、ゲームボードとしてhtmlを使って、スマホ操作に対応しています。得点は即座に反映されます。