Niech działa!

Lekcja 11 z 11 w kursie Okrągły pasek postępu | Projekt front-end w Coddy.

Tutaj zrozumiemy logikę kodu JavaScript, to, jak obraca on okrąg, oraz liczenie procentów.

(W podpowiedziach znajdują się wszystkie rozwiązania, ale najpierw spróbuj samodzielnie, a potem możesz sprawdzić podpowiedzi.)

Dla przypomnienia,
Aby wybrać komponent:

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

Aby zaktualizować tekst komponentu:

component.textContent = "new-text"

Aby zaktualizować styl komponentu:

component.style.background = "#fff"

Wyzwanie

Łatwy

Najpierw musimy wybrać obie klasy: circular-progress i progress-value. Musimy też przechowywać trzy osobne wartości: wartość początkową, wartość końcową i szybkość.
Każdy proces wymaga funkcji, którą trzeba wywołać z określoną szybkością, a do tego musimy użyć funkcji setTimeout.
Odśwież stronę internetową.

Spróbuj swoich sił

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Wpisz tutaj kod HTML -->
        <script src="script.js"></script>
    </body>
</html>