¿Cómo puedo hacer que varios elementos (3 en especifico) de cifras numéricas carguen al mismo tiempo (terminen por ejemplo, juntos, en 4 segundos) es decir, que todos terminen de contar (o aumentar) en 4 segundos con setTimeout en JavaScript.
Ya trate de hacerlo poniéndole decimales pero no funciona. Gracias
window.addEventListener('scroll', function(e){
e.preventDefault();
let scrollHeight = window.pageYOffset;
if(scrollHeight == 1020){
const products = document.querySelector('.product .cifras-block-container');
const sales = document.querySelector('.sales .cifras-block-container');
const alternative = document.querySelector('.alternative .cifras-block-container');
if(products.querySelector('span').textContent.replace(",","") == 30000)
{
timeOutAnimation(products, 30000, 0.1);
}
if(sales.querySelector('span').textContent.replace(",","") == 3500)
{
timeOutAnimation(sales, 3500, 0.8);
}
if(alternative.querySelector('span').textContent.replace(",","") == 181)
{
timeOutAnimation(alternative, 181, 12.4223602484472);
}
}
})
function timeOutAnimation(b, l, t,o=0)
{
if(o < l){
b.querySelector('span').textContent = ++o;
setTimeout(timeOutAnimation,t,b,l,t,o);
}
}