Przeskocz do treści

Lekcja 10 (JS)

Zdarzenia.

Zapoznaj się z materiałem umieszczonym pod linkiem: Zdarzenia.

Zadanie 1: Wykonaj 3 ćwiczenia na końcu rozdziału Zdarzenia.

Zadanie 2: Wykorzystując przykład opracuj dokument, w którym umieścisz obok siebie 4 obrazki (o1.png, o2.png, o3.png, o4.png) o wymiarach 100x100 pikseli, każdy w innym kolorze. Następnie oprogramuj zdarzenia po najechaniu wskaźnikiem myszy na wskazany obiekt tak, aby zmieniły one rozmiar na mniejszy 50x50 pikseli.

Zadanie 3: Wykorzystując przykład opracuj dokument, w którym umieścisz obrazek koła z wypełnieniem białym. Następnie po najechaniu wskaźnikiem myszy obrazek zostanie podmieniony na taki, który ma koło z wypełnieniem żółtym.

Zadanie 4: Wykorzystując przykład opracuj dokument, w którym umieścisz akapit z zawartością pobraną z serwisu Lorem Ipsum. Ustal kolor tekstu w akapicie na biały. Następnie oprogramuj zdarzenie tak, aby po najechaniu wskaźnikiem myszy na obszar akapitu kolor tła został zmieniony na czarny. Wykorzystaj funkcję backgroundColor (odszukaj w Internecie jak należy ją zastosować).

Zadanie 5: Wykorzystując pomoc zapisaną w przykładzie opracuj dokument, w którym umieścisz nagłówek poziomu 2 o treści: "Poniedziałek to dobry dzień na rozpoczęcie pracy.". Następnie przypisz do tego nagłówka zdarzenie polegające na podwójnym kliknięciu myszą. Efektem działania tak wywołanej funkcji ma być pojawienie się na ekranie poniżej nagłówka, akapitu o treści: "Piątek to dobry dzień na rozpoczęcie weekendu.". Na dole strony umieść przycisk do którego przypiszesz zdarzenie  uruchamiane w momencie najechania na niego wskaźnikiem myszy. Wywołana w ten sposób funkcja ma wyczyścić zawartość opisanego powyżej akapitu.

Zadanie 6: Wykorzystując pomoc zapisaną w przykładzie opracuj dokument, w którym umieścisz formularz zawierający 3 pola tekstowe jedno pod drugim. Następnie opracuj skrypty, które spowodują zmianę koloru tła w każdym z pól tekstowych na odpowiednio: pierwsze pole - czerwony, drugie pole - zielony, trzecie pole niebieski. Poniżej pól tekstowych dodaj trzy elementy typu radio, obok których umieścisz napisy: duży, średni, mały. Zaznaczenie wybranego elementu ma spowodować zmianę rozmiaru napisu obok elementu typu radio. Pamiętaj, aby możliwe było zaznaczenie tylko jednego elementu radio na raz. Zastosuj znacznik grupowania elementów dla wszystkich przycisków typu radio, przypisując grupie tytuł: Wybierz wielkość.

Sprawdzian 3

error: Content is protected !!