Loading screen Super fast's game

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

No:43472

132

←

Prev Next

→

Loading screen Super fast
Developer User19182｜Date and time 24/2/15 14:57:08
Build time 6.524 sec｜Game capacity 1.765KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいゲームランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>Super Fast Loading Game</title>
  <style>
    body {
      margin: 0;
      padding: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100vh;
      background-color: #f0f0f0;
    }
    
    #loading {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    
    #loading-text {
      font-size: 24px;
      margin-bottom: 20px;
    }
    
    #loading-bar {
      width: 300px;
      height: 20px;
      border: 1px solid #ccc;
      position: relative;
    }
    
    #loading-progress {
      height: 100%;
      background-color: #4caf50;
    }
  </style>
</head>
<body>
  <div id="loading">
    <div id="loading-text">Loading...</div>
    <div id="loading-bar">
      <div id="loading-progress"></div>
    </div>
  </div>

function updateLoadingBar(progress) {
    const loadingProgress = document.getElementById("loading-progress");
    loadingProgress.style.width = `${progress}%`;
  }

function simulateLoading() {
    const duration = 3000; // Simulated loading time in milliseconds
    const frameRate = 60; // Number of frames per second
    const frameDuration = 1000 / frameRate;
    const totalFrames = duration / frameDuration;
    let frameCount = 0;

const loadingInterval = setInterval(() => {
      frameCount++;
      const progress = (frameCount / totalFrames) * 100;
      updateLoadingBar(progress);

if (frameCount === totalFrames) {
        clearInterval(loadingInterval);
        document.getElementById("loading").remove();
        startGame();
      }
    }, frameDuration);
  }

simulateLoading();
</script>
</body>
</html>