<h1 class=>Progress Bar</h1>
<div class="h-3 relative max-w-xl rounded-full overflow-hidden">
<div class="w-full h-full bg-gray-200 absolute"></div>
<div id="bar" class="h-full bg-green-500 relative w-0"></div>
</div>
let progress = 0;
let invervalSpeed = 10;
let incrementSpeed = 1;
document.addEventListener("DOMContentLoaded", function(){
let bar = document.getElementById('bar');
progressInterval = setInterval(function(){
progress += incrementSpeed;
bar.style.width = progress + "%";
if(progress >= 100){
clearInterval(progressInterval);
}
}, invervalSpeed);
});
This Pen doesn't use any external JavaScript resources.