AI game creator

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

No:20549

←

Prev Next

→

Marble race
Developer User9091｜Date and time 23/10/10 4:42:17
Build time 16.452 sec｜Game capacity 2.657KB｜

Script

Sure! Here's an example of a simple marble race game that can be played on a smartphone using pictograms:

🏁

⬇️

⬅️

In this game, the user controls a red marble using pictograms. By clicking on the down (⬇️) pictogram, the marble moves downward, and by clicking on the left (⬅️) pictogram, the marble moves leftwards. The goal is to reach the finish line (🏁) at the bottom of the screen. Once the marble reaches the finish line, a congratulations alert is displayed, and further movement is disabled.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

Sure! Here's an example of a simple marble race game that can be played on a smartphone using pictograms:

```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Marble Race Game</title>
  <style>
    body {
      margin: 0;
      padding: 0;
      overflow: hidden;
      background-color: #F0F0F0;
    }
    
    #track {
      position: relative;
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-start;
    }
    
    .marble {
      position: absolute;
      width: 50px;
      height: 50px;
      background-color: #FF0000;
      border-radius: 50%;
      transition: transform 0.5s;
    }
    
    .pictogram {
      font-size: 30px;
    }
  </style>
</head>
<body>
  <div id="track">
    <div class="marble"></div>
    <div class="pictogram">🏁</div>
    <div class="pictogram">⬇️</div>
    <div class="pictogram">⬇️</div>
    <div class="pictogram">⬅️</div>
    <div class="pictogram">⬅️</div>
    <div class="pictogram">⬅️</div>
  </div>

let currentTop = 0;
      let isGameFinished = false;

function moveMarble(direction) {
        if (isGameFinished) return;

switch (direction) {
          case 'down':
            currentTop += 100;
            break;
          case 'left':
            currentTop -= 100;
            break;
        }

if (currentTop >= window.innerHeight - marble.offsetHeight) {
          isGameFinished = true;
          alert('Congratulations! You reached the finish line!');
        } else {
          marble.style.transform = `translateY(${currentTop}px)`;
        }
      }

pictograms.forEach(pictogram => {
        pictogram.addEventListener('click', function() {
          const direction = this.innerText.toLowerCase();
          moveMarble(direction);
        });
      });
    });
  </script>
</body>
</html>
```