P ISZ MNIEJ, RÓB WIĘCEJ - ZASTOSOWANIE J Q UERY Kamil Szumański s4126.

Prezentacja na temat: "P ISZ MNIEJ, RÓB WIĘCEJ - ZASTOSOWANIE J Q UERY Kamil Szumański s4126."— Zapis prezentacji:

1 P ISZ MNIEJ, RÓB WIĘCEJ - ZASTOSOWANIE J Q UERY Kamil Szumański s4126

2 P LAN PREZENTACJI 1. Wprowadzenie 2. Dlaczego warto go poznać? 3. Co daje użycie jQuery? 4. jQuery – z czym to się je? 5. Jak działa jQuery? 6. Animacje w jQuery 7. jQuery plugins. 8. jQuery i Microsoft 9. Wprowadzenie do jQuery w ASP.NET 10. jQuery – kilka przykładów 11. Podsumowanie

3 J Q UERY - W PROWADZENIE John Resig - twórca biblioteki jQuery to jeden z frameworkówdo JavaScript Pozostałe popularne frameworki: Prototype, mootools, cssQuery, dojo Wykorzystany przez wiele dużych stron Bank of America, Dell, Netflix, NBC czy Mozilla.org. Wsparcie ze strony Microsoftu i Nokii

4 D LACZEGO WARTO GO POZNAĆ ? Łatwy w użyciu Bardzo ergonomiczny Open source Licencje MIT i GPL Jest kompatybilny z wieloma przeglądarkami: Internet Explorer 6+, Firefox 2+, Opera 9+, and Safari 2+, Chrome Mały rozmiar 20KB Szybkość działania Dobrze działa z innymi bibliotekami CSS 3

5 C O DAJE UŻYCIE J Q UERY ? Drastycznie zmniejsza ilość JavaScript kodu Kod staje się bardziej czytelny i zwięzły Zapewni kompatybilność z popularnymi przeglądarkami Możliwość uzyskania ciekawych efektów przy małym nakładzie pracy

6 J AK DZIAŁA J Q UERY Szukanie elementów HTML $("p") $("form:first input:checkbox") $("#main > div.entry:visible a.comments:contains('komentarz')")

7 J AK DZIAŁA J Q UERY CD. Tworzenie elementów HTML var $link = $( document.createElement("a") ); var $link = $(" "); var $link = $(" Hello world! ");

8 J AK DZIAŁA J Q UERY CD. Tworzenie elementów HTML $("#main").find("p").not(".ohmy").addClass("new")

9 J AK DZIAŁA J Q UERY CD. Automatyczna iteracja

10 S ELEKTORY J Q UERY – MAGIA J Q UERY $(#firstName) Wybiera element z Id firstName $(":text") Wybiera wszystkie text boksy $(.required) Wybiera wszystkie elementy z klasą required $("#grd tr:even") Wybiera parzyste wiersze z elementu o id grd

11 A NIMACJE W J Q UERY $(…).show() $(…).hide() $(…).slideDown() $(…).slideUp() $(…).fadeIn() $(…).fadeOut()

12 J Q UERY PLUGINS http://plugins.jquery.com

13 J Q UERY I M IRCOSOFT Microsoft will not fork jQuery jQuery included as-is jQuery zostanie dołączone pod MIT licencją Microsoft będzie aktywnie wspierał jQuery Microsoft zapewnie pełne wsparcie dla jQuery pomoc techniczną Tutoriale, materiały, pomoce dla użytkowników Visual Studio Microsoft zintegruje jQuery z najnowszą wersją Visual Studia

14 W PROWADZENIE DO J Q UERY W ASP. NET ASP.NET AJAX AJAX Requests Components and Controls Client Templates AJAX Control Toolkit jQuery Selectors Animations Plugins

15 J Q UERY – KILKA PRZYKŁADÓW przykład 1 przykłada 2 przykład 3

16 P ODSUMOWANIE jQuery to rozbudowany framework Można szybko i łatwo zacząć z nim prace Można rozbudować jego funkcjonalność przez zastosowanie wielu wtyczek (plugins) Będz ie wykorzystywany w najnowszym VisualStudio

17 J Q UERY Dziękuje za uwage!