Strona Nikodema

Strona do ćwiczeń

Ćwiczenia jQuery

jQuery


Home PageJoomlajQuery  |  Ć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!".

Joomla

           


Home PageJoomla 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ę