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

No:43171

เกมคนวิ่งผ่านด่านมีเส้นชัยชนะ
Developer User19114｜Date and time 24/2/14 16:21:49
Build time 11.983 sec｜Game capacity 4.614KB｜

Script

เกมคนวิ่งผ่านด่านมีเส้นชัยชนะ

🏃

Score: 0

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <title>เกมคนวิ่งผ่านด่านมีเส้นชัยชนะ</title>
    <style>
        body {
            background-color: #f1f1f1;
            text-align: center;
        }

#player {
            position: absolute;
            top: 50%;
            left: 50px;
            transform: translate(0, -50%);
        }

.obstacle {
            position: absolute;
            width: 50px;
            height: 50px;
            background-color: red;
            border-radius: 50%;
        }

#winLine {
            position: absolute;
            width: 5px;
            height: 200px;
            background-color: green;
            top: 30%;
            left: 95%;
        }

#score {
            position: absolute;
            top: 10px;
            left: 10px;
            font-size: 24px;
        }
    </style>
</head>
<body>
    <script>
        document.addEventListener('DOMContentLoaded', function () {
            var player = document.getElementById('player');
            var score = document.getElementById('score');
            var obstacles = document.getElementsByClassName('obstacle');
            var winLine = document.getElementById('winLine');
            var scoreCount = 0;

var gameStart = setInterval(function () {
                scoreCount++;
                score.innerText = 'Score: ' + scoreCount;
            }, 1000);

function moveUp() {
                var topPos = parseInt(
                    window.getComputedStyle(player).getPropertyValue('top')
                );
                if (topPos >= 10) {
                    player.style.top = (topPos - 10) + 'px';
                }
            }

function moveDown() {
                var topPos = parseInt(
                    window.getComputedStyle(player).getPropertyValue('top')
                );
                if (topPos <= (window.innerHeight - 60)) {
                    player.style.top = (topPos + 10) + 'px';
                }
            }

function checkCollision() {
                var playerPos = player.getBoundingClientRect();

for (var i = 0; i < obstacles.length; i++) {
                    var obstaclePos = obstacles[i].getBoundingClientRect();
                    if (
                        playerPos.left < obstaclePos.left + obstaclePos.width &&
                        playerPos.left + playerPos.width > obstaclePos.left &&
                        playerPos.top < obstaclePos.top + obstaclePos.height &&
                        playerPos.top + playerPos.height > obstaclePos.top
                    ) {
                        clearInterval(gameStart);
                        alert('Game Over! Your final score is: ' + scoreCount);
                        resetGame();
                        break;
                    }
                }

var winLinePos = winLine.getBoundingClientRect();
                if (
                    playerPos.left < winLinePos.left + winLinePos.width &&
                    playerPos.left + playerPos.width > winLinePos.left &&
                    playerPos.top < winLinePos.top + winLinePos.height &&
                    playerPos.top + playerPos.height > winLinePos.top
                ) {
                    clearInterval(gameStart);
                    alert('Congratulations! You reached the finish line!');
                    resetGame();
                }
            }

function resetGame() {
                player.style.top = '50%';
                scoreCount = 0;
                score.innerText = 'Score: 0';
                gameStart = setInterval(function () {
                    scoreCount++;
                    score.innerText = 'Score: ' + scoreCount;
                }, 1000);
            }