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

No:18782

←

Prev Next

→

Elevator
Developer User7816｜Date and time 23/9/30 18:27:55
Build time 9.193 sec｜Game capacity 2.759KB｜

Script

Elevator Game

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <title>Elevator Game</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
        }
        
        #elevator {
            display: inline-block;
            background-color: #f0f0f0;
            width: 200px;
            height: 300px;
            padding: 20px;
            border-radius: 10px;
            margin-bottom: 20px;
        }
        
        #floor-buttons {
            margin-top: 20px;
        }
        
        .floor-button {
            display: inline-block;
            width: 30px;
            height: 30px;
            background-color: #ccc;
            border: none;
            margin-right: 10px;
            border-radius: 50%;
            font-size: 14px;
            color: #555;
            cursor: pointer;
        }
        
        .floor-button:hover {
            background-color: #bbb;
        }
        
        #current-floor {
            margin-top: 10px;
            font-weight: bold;
        }
    </style>
</head>
<body>
    <h1>Elevator Game</h1>
    
    <div id="elevator">
        <div id="current-floor">1</div>
        <div id="floor-buttons">
            <button class="floor-button" onclick="goToFloor(1)">1</button>
            <button class="floor-button" onclick="goToFloor(2)">2</button>
            <button class="floor-button" onclick="goToFloor(3)">3</button>
            <button class="floor-button" onclick="goToFloor(4)">4</button>
            <button class="floor-button" onclick="goToFloor(5)">5</button>
        </div>
    </div>
    
    <script>
        var currentFloor = 1;
        
        function goToFloor(floor) {
            if (floor === currentFloor) {
                return;
            }
            
            var elevator = document.getElementById('elevator');
            var floorButtons = document.getElementsByClassName('floor-button');
            
            elevator.style.animationName = 'moveElevator';
            elevator.style.animationDuration = Math.abs(floor - currentFloor) * 0.5 + 's';
            
            setTimeout(function () {
                currentFloor = floor;
                document.getElementById('current-floor').textContent = floor;
                
                elevator.style.animationName = '';
                elevator.style.animationDuration = '';
                
                for (var i = 0; i < floorButtons.length; i++) {
                    floorButtons[i].disabled = false;
                }
            }, Math.abs(floor - currentFloor) * 500);
            
            for (var i = 0; i < floorButtons.length; i++) {
                floorButtons[i].disabled = true;
            }
        }
    </script>
</body>
</html>