Strona Nikodema
jQuery
Home Page | Joomla | jQuery | Ćw. Joomla 2
Ćwiczenia:
*nagłówki "ogólny przykład" jak i "ćwiczenie.." są również linkami do podstron z wykonanymi zadaniami.*
Ogólny przykład
>>>>
- · $('#textDiv p').addClass('boldGray') - nadanie klasy boldGray wszystkim akapitom znajdującym się w warstwie textDiv.
- · $("#textDiv p").css({background : "blue"}).delay(2000).slideUp().delay(1000).fadeIn(1000) – ustawia tło paragrafów jako niebieskie, ustawia opóźnienie 2000 ms, za pomocą fukcji slideUp textDiv zawija się do góry a następnie po opóźnieniu 1000ms uruchamiany jest efekt fadeIn z prędkością 1000ms.
Ćwiczenie 1
- >>>
· $('#textDiv p').text('Taki sam tekst.') – powoduje wpisanie tego samego określonego tesktu do każdego z paragrafów w textDiv.
>
Ćwiczenie 2
- >>>
· $("p").click(function(){ $(this).hide(); }); - ukrywa paragraf po kliknięciu w niego.
>
Ćwiczenie 3
- >>>
· $("p").hide(); - zmiana this na „p” powoduje odwołanie się do wszystkich paragrafów naraz a nie jedynie tego który został kliknięty. This wybiera bieżący element HTML.
>
Ćwiczenie 4
- >>>
· $("button").click(function(){ $("p").hide(); }); - po kliknięciu przycisku „buton” wszystkie paragrafy zostaną ukryte.
>
Ćwiczenie 5
- >>>
· $("#p1").mouseenter(function(){ alert("You entered p1!"); }); - po najechaniu na paragraf o id=”p1” zostanie wyświetlony komunikat "You entered p1!".
>
Joomla
Home Page | Joomla | jQuery | Ćw. Joomla 2
jQuery – lekka biblioteka programistyczna dla języka Javascript, ułatwiająca korzystanie z Javascriptu.
Zadania Joomla:
1. Utwórz nowa kategorie i nazwij ją "witryny"
2. Utwórz artykuł o nazwie "jQuery" uzupełnij go o treść
3. Utwórz menu o nazwie "menu1"
4. Użyj menu1 i wstaw do niego powyższy artykuł
5. Uzupełnij artykuł o grafikę