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

No:28303

110

←

Prev Next

→

Pocket town: style new hair!.. look a dog poo!.. i..ALL
Developer User13970｜Date and time 23/12/11 22:34:12
Build time 22.283 sec｜Game capacity 2.495KB｜

Script

Sure! Here's a simple game implementation based on your requirements:

Pocket Town

Drag and Play!

In this game, there is a "Pocket Town" represented by a div container. You can find three draggable person pictograms inside the container. You can drag and play with them. Additionally, there is a dog poo pictogram displayed at the bottom center, and when clicked, it shows an alert message. Please note that you need to replace the image file names (`emozi_all/person.png` and `emozi_hamuster.png`) with the actual image files you have. Also, feel free to modify the styling and add more functionality to make it a complete game.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a simple game implementation based on your requirements:

```html
<!DOCTYPE html>
<html>
  <head>
    <style>
      #game-container {
        width: 300px;
        height: 400px;
        border: 2px solid black;
        margin: 0 auto;
        position: relative;
      }

.person {
        display: inline-block;
        margin: 10px;
        cursor: pointer;
      }

#poo {
        position: absolute;
        bottom: 10px;
        left: 50%;
        transform: translateX(-50%);
        cursor: pointer;
      }
    </style>
  </head>
  <body>
    <h1>Pocket Town</h1>
    <div id="game-container">
      <h2>Drag and Play!</h2>
      <div class="person" draggable="true">
        <img src="person.png" alt="person" width="60" height="60" />
      </div>
      <div class="person" draggable="true">
        <img src="person.png" alt="person" width="60" height="60" />
      </div>
      <div class="person" draggable="true">
        <img src="person.png" alt="person" width="60" height="60" />
      </div>
      <img id="poo" src="poo.png" alt="poo" width="40" height="40" />
    </div>

for (const person of persons) {
          person.addEventListener("dragstart", handleDragStart);
          person.addEventListener("dragend", handleDragEnd);
        }

poo.addEventListener("click", handlePooClick);
      });

function handleDragStart(event) {
        const target = event.target;
        event.dataTransfer.setData("text/plain", target.id);
        target.style.opacity = "0.5";
      }

function handleDragEnd(event) {
        const target = event.target;
        target.style.opacity = "1";
      }

function handlePooClick() {
        alert("Eww! Watch your step!");
      }
    </script>
  </body>
</html>
```

Please note that you need to replace the image file names (`person.png` and `poo.png`) with the actual image files you have. Also, feel free to modify the styling and add more functionality to make it a complete game.