html - Javascript Countdown with Twitter Bootstrap Progress Bar -

html - Javascript Countdown with Twitter Bootstrap Progress Bar -

i working twitter bootstrap. need redirect page after 30 seconds. want utilize twitter bootstrap progress bar indicate how long till page redirects (so page redirects when bar @ 100%). please help me javascript , html code this.

thanks ;)

very basic example:

var bar = document.getelementbyid('progress'), time = 0, max = 5, int = setinterval(function() { bar.style.width = math.floor(100 * time++ / max) + '%'; time - 1 == max && clearinterval(int); }, 1000);

code wrapped in function:

class="snippet-code-js lang-js prettyprint-override">function countdown(callback) { var bar = document.getelementbyid('progress'), time = 0, max = 5, int = setinterval(function() { bar.style.width = math.floor(100 * time++ / max) + '%'; if (time - 1 == max) { clearinterval(int); // 600ms - width animation time callback && settimeout(callback, 600); } }, 1000); } countdown(function() { alert('redirect'); }); class="snippet-code-css lang-css prettyprint-override">body {padding: 50px;} class="snippet-code-html lang-html prettyprint-override"><link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css" rel="stylesheet"/> <div class="progress"> <div class="bar" id="progress"></div> </div>

javascript html twitter-bootstrap