Strona Nikodema

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

1. ·         $('#textDiv p').addClass('boldGray') - nadanie klasy boldGray wszystkim akapitom znajdującym się w warstwie textDiv.
2. ·         $("#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

1. ·         $('#textDiv p').text('Taki sam tekst.') – powoduje wpisanie tego samego określonego tesktu do każdego z paragrafów w textDiv.

Ćwiczenie 2

1. ·         $("p").click(function(){   $(this).hide();      }); - ukrywa paragraf po kliknięciu w niego.

Ćwiczenie 3

1. ·         $("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

1. ·         $("button").click(function(){ $("p").hide();   }); - po kliknięciu przycisku „buton” wszystkie paragrafy zostaną ukryte.

Ćwiczenie 5

1. ·         $("#p1").mouseenter(function(){  alert("You entered p1!");   }); - po najechaniu na paragraf o id=”p1” zostanie wyświetlony komunikat "You entered p1!".