100-project-100-days-website/100_projects/74-visual-counter/main.js
2023-05-06 18:52:10 +03:00
Ask

23 lines
578 B
JavaScript

{5abec71ba8df6272252d2951a5d6c03c532e7f13 true 578 main.js 0xc001f26e70}

const counters = document.querySelectorAll('.counter');
// this could work for multiple counters
counters.forEach(counter => {
// start with 0 by default
counter.innerText = '0';
const updateCounter = () => {
const target = +counter.getAttribute('data-target');
const c = +counter.innerText;
// get the 0.1% to speed up things
const increment = target / 2000;
if(c < target) {
counter.innerText = `${Math.ceil(c + increment)}`;
setTimeout(updateCounter, 1)
} else {
counter.innerText = target;
}
};
updateCounter();
});