A game where you got to Drag the Guy that's on your screen Bank his head on Anything's game

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

No:16919

←

Prev Next

→

A game where you got to Drag the Guy that's on you..ALL
Developer User7456｜Date and time 23/9/21 21:23:06
Build time 22.679 sec｜Game capacity 2.23KB｜

Script

Sure! Here's a simple HTML game where you need to drag a character's head and hit it against various objects on the screen. The game is designed for smartphone operation and uses pictograms.

To play the game: 1. Save the code as a .html file (e.g. "hit_the_head_game.html"). 2. Open the file using any web browser on your smartphone. 3. You'll see a square box on the screen. You can drag the orange target inside the box by touching and dragging it. 4. Try to hit the target's head on any other objects or borders inside the box. Note: Since the game is simple, it doesn't have specific objects to hit the head on. You can customize and add more objects as needed in the #gameContainer section of the CSS part.

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

Sure! Here's a simple HTML game where you need to drag a character's head and hit it against various objects on the screen. The game is designed for smartphone operation and uses pictograms.

```html
<!DOCTYPE html>
<html>
<head>
  <title>Hit the Head Game</title>
  <style>
    /* CSS styles for the game */
    #gameContainer {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 300px;
      height: 300px;
      background-color: #eee;
      border: 2px solid #ccc;
      padding: 10px;
    }
    #target {
      width: 80px;
      height: 80px;
      background-color: orange;
      position: absolute;
      top: 100px;
      left: 100px;
      cursor: grab;
    }
  </style>
</head>
<body>
  <div id="gameContainer">
    <div id="target"></div>
  </div>

// Drag start event listener
      target.addEventListener('mousedown', (event) => {
        isDragging = true;
        startOffsetX = event.clientX - target.offsetLeft;
        startOffsetY = event.clientY - target.offsetTop;
      });

// Drag end event listeners
      window.addEventListener('mouseup', () => {
        isDragging = false;
      });
      window.addEventListener('mousemove', (event) => {
        if (isDragging) {
          target.style.left = event.clientX - startOffsetX + 'px';
          target.style.top = event.clientY - startOffsetY + 'px';
        }
      });
    });
  </script>
</body>
</html>
```

Note: Since the game is simple, it doesn't have specific objects to hit the head on. You can customize and add more objects as needed in the #gameContainer section of the CSS part.