¡Haz que funcione!

Lección 11 de 11 del curso Barra de progreso circular | Proyecto Front-end de Coddy.

Aquí entenderemos la lógica del código de javascript, cómo rotará un círculo y el conteo de porcentaje.

(Las pistas tienen todas las soluciones, pero inténtalo tú mismo primero y luego puedes consultar las pistas).

Como recordatorio,
Para apuntar a un componente:

let component = document.querySelector(".some-class");

Para actualizar el texto de un componente:

component.textContent = "new-text"

Para actualizar el estilo de un componente:

component.style.background = "#fff"

Desafío

Fácil

En primer lugar, tenemos que apuntar a ambas clases: circular-progress y progress-value. Además, tenemos que almacenar tres valores individuales, que son el valor inicial, el valor final y la velocidad.
Todos los procesos necesitan una función que debe ser llamada a una velocidad específica, y para ello, necesitamos usar la función setTimeout.
Haz clic en refrescar en la página web.

Pruébalo tú mismo

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Write HTML code here -->
        <script src="script.js"></script>
    </body>
</html>