Dynamiczny rozmiar czcionki z suwaka
Treść zadania
W formularzu umieszczono suwak <input type="range" id="suwakRozmiaru" min="12" max="48" value="16"> oraz akapit <p id="podglad">Przykładowy tekst do czytania</p>. Na zdarzenie input suwaka ustaw wielkość czcionki akapitu (właściwość fontSize), łącząc odczytaną wartość liczbową z jednostką pikseli 'px' (np. '24px').
Co będzie oceniane
- Nasłuchiwanie zdarzenia input na suwaku #suwakRozmiaru.
- Konkatenacja wartości suwaka z jednostką 'px'.
- Modyfikacja właściwości style.fontSize akapitu #podglad.
- Kod uruchamia się bez błędu i przechodzi wszystkie testy automatyczne.
Testy automatyczne (1)
- Ustawienie rozmiaru czcionki na 24px — atrybut #podglad = font-size: 24px
Zaliczenie: wszystkie testy muszą przejść. Testy uruchamia się przyciskiem „Sprawdź testy” pod kodem.
// Zmieniaj rozmiar czcionki akapitu #podglad na zdarzenie input suwaka #suwakRozmiaru
Wskazówki
Wskazówka 1
Wykorzystaj zdarzenie aktualizacji wartości kontrolki suwaka i pamiętaj o dopisaniu jednostki miary CSS na końcu wartości liczbowej.
Wskazówka 2
Zarejestruj nasłuchiwacz zdarzenia na suwaku. Odczytaj wartość pola, połącz ją znakiem dodawania z jednostką pikseli i przypisz do właściwości rozmiaru czcionki akapitu.