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

No:19026

←

Prev Next

→

Лифт
Developer User7816｜Date and time 23/10/1 14:52:40
Build time 11.772 sec｜Game capacity 3.073KB｜

Script

Лифт

︎

←

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 {
        font-family: Arial, sans-serif;
        text-align: center;
      }
      
      #floor-buttons {
        margin-bottom: 20px;
      }

.floor-button {
        display: inline-block;
        width: 30px;
        height: 30px;
        margin: 5px;
        background-color: #eaeaea;
        border-radius: 50%;
        cursor: pointer;
        line-height: 30px;
        font-size: 16px;
      }

.floor-button.active {
        background-color: #0080ff;
        color: #ffffff;
      }

#elevator {
        width: 100px;
        height: 120px;
        background-color: #333333;
        color: #ffffff;
        margin: 0 auto;
        padding-top: 20px;
      }

#elevator-state {
        font-size: 18px;
        font-weight: bold;
      }
    </style>
  </head>
  <body>
    <h1>Лифт</h1>
    <div id="floor-buttons">
      <div class="floor-button" id="1">︎</div>
      <div class="floor-button" id="2">︎</div>
      <div class="floor-button" id="3">︎</div>
      <div class="floor-button" id="4">︎</div>
      <div class="floor-button" id="5">︎</div>
    </div>
    <div id="elevator">
      <div id="elevator-floor">1</div>
      <div id="elevator-state"></div>
    </div>

// Event listeners for floor buttons
      const floorButtons = document.querySelectorAll('.floor-button');
      floorButtons.forEach((button) => {
        button.addEventListener('click', () => {
          const floor = parseInt(button.id);
          targetFloor = floor;
          moveElevator();
        });
      });

// Main function to move the elevator
      function moveElevator() {
        if (targetFloor === currentPosition) {
          return; // Do nothing if elevator is already on target floor
        }

// Changing elevator state
        const elevatorState = document.getElementById('elevator-state');
        elevatorState.textContent = `Elevator moving from ${currentPosition} to ${targetFloor}`;

// Calculate animation duration based on the difference in floors
        const animationDuration = Math.abs(targetFloor - currentPosition) * 1000;
        const elevator = document.getElementById('elevator');
        
        // Animated movement of elevator
        elevator.style.transform = `translateY(${(targetFloor - 1) * 120}px)`;
        setTimeout(() => {
          // Update current position
          currentPosition = targetFloor;

// Update elevator floor display
          const elevatorFloor = document.getElementById('elevator-floor');
          elevatorFloor.textContent = currentPosition;

// Reset target floor
          targetFloor = null;

// Clear elevator state display
          elevatorState.textContent = '';
        }, animationDuration);
      }
    </script>
  </body>
</html>