html5 progress

by Akram kamal

HTML

<progress></progress>
<br><br>
     <hr>
<progress value="10" max="100"></progress>
 <hr>
    <p> We’ve made it to 50% of our funding goal! <span>$0</span><progress value="5012" max="10000" id="funding"></progress><span>$10,000</span> </p>
    
    <br><br>
    <hr>
   <p> However, the output element can be used with progress to show its value. A simple example:

       Progress towards our $10,000 pledge drive:</p>
<progress min=0 max=10000 value=5012 id=funding onchange=pledgeUpdate></progress>
<output for=funding id=totalDonations>0</output>

JavaScript

var funding = document.getElementById('funding').value;
pledgeUpdate();
function numberWithCommas(x) {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
function pledgeUpdate() {
document.getElementById('totalDonations').value = "$"+numberWithCommas(funding);
}