Przełączanie slajdu w przód za pomocą indeksu
Treść zadania
W skrypcie zdefiniowano tablicę adresów grafik:const zdjecia = ["foto1.jpg", "foto2.jpg", "foto3.jpg"];
let aktualny = 0;
W dokumencie znajduje się obraz <img id="podgladSlajdu" src="foto1.jpg" alt="Slajd"> oraz przycisk <button id="btnNastepny">Następny</button>.
Po kliknięciu przycisku zwiększ zmienną aktualny o jeden (gdy nie przekracza zakresu) i przypisz nowy adres z tablicy zdjecia[aktualny] do właściwości src obrazka.
Co będzie oceniane
- Inkrementacja zmiennej indeksu slajdu.
- Odczyt adresu z tablicy zdjecia.
- Przypisanie nowego adresu do #podgladSlajdu.src.
- Kod uruchamia się bez błędu i przechodzi wszystkie testy automatyczne.
Testy automatyczne (1)
- Przejście do drugiego slajdu foto2.jpg — atrybut #podgladSlajdu = foto2.jpg
Zaliczenie: wszystkie testy muszą przejść. Testy uruchamia się przyciskiem „Sprawdź testy” pod kodem.
const zdjecia = ["foto1.jpg", "foto2.jpg", "foto3.jpg"];
let aktualny = 0;
// Zwiększaj indeks i zmieniaj src obrazka #podgladSlajdu po kliknięciu #btnNastepny
Wskazówki
Wskazówka 1
Karuzela opiera się na zmiennej globalnej przechowującej numer aktualnego slajdu w tablicy ścieżek.
Wskazówka 2
Zwiększ wartość zmiennej indeksu o 1 przy kliknięciu przycisku i przypisz element tablicy spod nowego indeksu do właściwości źródła znacznika img.