Senin, 10 November 2014

CARA MENAMBAH PROGRESS BAR DI BLOG

Contoh:



0%
Script:
<script type="text/javascript">
//current progress
var currProgress = 0;
//is the task complete
var done = false;
//total progress amount
var total = 100;

//function to update progress
function startProgress() {
//get the progress element
var prBar = document.getElementById("prog");
//get the start button
var startButt = document.getElementById("startBtn");
//get the textual element
var val = document.getElementById("numValue");
//disable the button while the task is unfolding
startButt.disabled=true;
//update the progress level
prBar.value = currProgress;
//update the textual indicator
val.innerHTML = Math.round((currProgress/total)*100)+"%";
//increment the progress level each time this function executes
currProgress++;
//check whether we are done yet
if(currProgress>100) done=true;
//if not done, call this function again after a timeout
if(!done)
    setTimeout("startProgress()", 100);
//task done, enable the button and reset variables
else     
{
    document.getElementById("startBtn").disabled = false;
    done = false;
    currProgress = 0;
}
}
</script>
<progress id="prog" max="100" value="0"></progress>
<br />
<input id="startBtn" onclick="startProgress()" type="button" value="start" />

<br />
<div id="numValue">
0%</div>

Tidak ada komentar:

Posting Komentar