Posted By

cfleschhut on 02/15/10

Tagged

javascript
animation

Versions (?)

Last Edited at 02/15/10 01:56pm

Statistics

Viewed 690 times

Favorited by 0 user(s)

Related snippets

Basic JavaScript Progressbar Animation

/ Published in: JavaScript

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

<div id="progress" style="background: green; width: 0;">&nbsp;</div>
<p><a href="#" onclick="progress(); return false;">start</a></p>
 
function progress() {
    var loadingbar = document.getElementById("progress");
    var width = parseInt(loadingbar.style.width);
    width++;
    loadingbar.style.width = width + "px";
    if (width < 300) {
        setTimeout(progress, 10);
    }
}