Aprende a Hacer Un Contador Animado de Números en Wix Studio: Guía Completa

Hola Gente! Les comparto este vídeo para que puedan Crear Un Contador de Números ANIMADO en Wix Studio.

Espero les sirva mucho! Suscríbanse (REALLY, los veo pues) y dejen su like, saludos!

No olvides comentar alguna pregunta!

https://youtu.be/_Ia--d1lJME

CODE

const timeDuration = 3; //milisegundos

const timeDurationYear = 80; //milisegundos

let startNumber = 1;
const endNumber = 600;

let startNumberYear = 1;
const endNumberYear = 20;

let intervalId, intervalYearsId;

$w.onReady(() => {
    $w('#section9').onViewportEnter(() => {

        if (!intervalId) { // Verificar si el intervalo ya está en ejecución
            intervalId = setInterval(() => {
                if (startNumber <= endNumber) {
                    $w("#number").text = startNumber.toLocaleString();
                    startNumber += 1;
                } else {
                    clearInterval(intervalId); // Detener el intervalo al alcanzar el número final
                    intervalId = null; // Reiniciar el ID para futuras ejecuciones
                }
            }, timeDuration);
        }

        if (!intervalYearsId) { // Verificar si el intervalo ya está en ejecución
            intervalYearsId = setInterval(() => {
                if (startNumberYear <= endNumberYear) {
                    $w("#years").text = startNumberYear.toLocaleString();
                    startNumberYear += 1;
                } else {
                    clearInterval(intervalYearsId); // Detener el intervalo al alcanzar el número final
                    intervalYearsId = null; // Reiniciar el ID para futuras ejecuciones
                }
            }, timeDurationYear);
        }
    });
});

---

#wix #español #tutorial #velo #wixsite #code #youtube #universalwebcode #animated #animado #numbercounting #contador #numeros #efectos #website #wixstudio #facil