====== Wstęp ======

jQuery to JavaScriptowy framework, dostępny pod adresem: www.jquery.com. Jest fajny i w ogóle. ;-)

====== Podstawy ======

<code javascript>
if ($) {
    $(document).ready(
        function() {
            $('p').addClass('tmpFrameworkZaladowany');
            $('p').text('jQuery zaladowane poprawnie!');
        }
);
}
</code>

"''$''" zawiera w sobie całą funkcjonalność jQuery, przez co linijki kodu są krótsze.
Zamiast $ można też używać "jQuery" (jQuery(document).ready {}...
Zdarzenie jest połączone ze zdarzeniem jQuery ''ready'', które jest uruchamiane
gdy DOM jest w pełni załadowany (znaczniki, js, css ale nie obrazki). W naszym
przykładzie, jak tylko dokument się załaduje, jQuery wybiera znacznik ''<p>'' i 
nadaje mu klasę ''tmpFrameworkZaladowany''. Następnie zmienia jego tekst na "jQuery
zaladowane poprawnie". 

Odpowiednik w JS bez jQuery:

<code javascript>
window.onload = function() {
   var $p = document.getElementsByTagName('p')[0];
   $p.className = 'tmpFrameworkZaladowany';
   if ($p.innerText) {
      $p.innerText = 'jQuery zaladowane poprawnie!';
   } else {
      $p.textContent = 'jQuery zaladowane poprawnie!';
   }
};
</code>

Zmiana CSS:

<code javascript>
$('p a').css('color', 'blue');
</code>

====== Selektory i filtrowanie ======

<code javascript>
var tmpExample = {
    ready : function() {
        // zbierz wszystkie linki
        $('ul#tmpFavorites li a').click(
        function($e) {
            $e.preventDefault();
            window.open(this.href, 'FavoriteLink', '');
        }
    );
    }
};

$(document).ready(tmpExample.ready);
</code>

Funkcja powyższa służy do otwierania wszystkich linków <a> znajdujących się w 
<ul> o id="tmpFavorites" w elementach <li> w nowym oknie (zamiast w tym samym).

Tworzymy nowy obiekt ''tmpExample'', który zawiera jedną metodę, ''ready''. W tej metodzie
znajdują się wszystkie instrukcje wykonywane gdy dokument będzie gotowy.

====== Zdarzenia ======

qwerty

====== Metody Fade, Slide, Show i Hide ======

Mamy FadeIn, FadeOut, SlideUp, SlideDown, Show, Hide...
<code javascript>
$(function() {
   $('a').click(function() {
      $('#box').slideUp(4000);
   });
});
</code>

====== Metoda Animate ======

<code javascript>
$(function() {
   $('#box').click(function() {
      $(this).animate({"left" : "300px"}, 4000);
      $(this).animate({"width" : "50px"}, 4000);
    });
})
</code>

====== Linki ======

  * http://net.tutsplus.com/tutorials/javascript-ajax/10-super-helpful-traversing-functions-in-jquery/