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

No:36011

←

Prev Next

→

Poppy play time
Developer User16706｜Date and time 24/1/16 6:21:05
Build time 9.171 sec｜Game capacity 2.35KB｜

Script

Poppy Play Time

⬆

⬅

➡

⬇

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

<html>
<head>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
            background-color: #F3F3F3;
        }

#game {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-top: 100px;
        }

#poppy {
            width: 100px;
            height: 100px;
            background-image: url('poppy.png');
            background-size: cover;
        }

#buttons {
            display: flex;
            justify-content: center;
            margin-top: 30px;
        }

.button {
            width: 50px;
            height: 50px;
            margin: 5px;
            background-color: #FFD700;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
        }
    </style>
</head>
<body>
    <div id="game">
        <h1>Poppy Play Time</h1>
        <div id="poppy"></div>
        <div id="buttons">
            <div id="upButton" class="button"><span>⬆</span></div>
            <div id="leftButton" class="button"><span>⬅</span></div>
            <div id="rightButton" class="button"><span>➡</span></div>
            <div id="downButton" class="button"><span>⬇</span></div>
        </div>
    </div>

var poppyPos = { x: 0, y: 0 };

upButton.addEventListener('click', function() {
            movePoppy(0, -10);
        });

leftButton.addEventListener('click', function() {
            movePoppy(-10, 0);
        });

rightButton.addEventListener('click', function() {
            movePoppy(10, 0);
        });

downButton.addEventListener('click', function() {
            movePoppy(0, 10);
        });

function movePoppy(x, y) {
            poppyPos.x += x;
            poppyPos.y += y;

poppy.style.left = poppyPos.x + 'px';
            poppy.style.top = poppyPos.y + 'px';
        }
    </script>
</body>
</html>