jQuery może i jest za ciężkie, ale nie można mu odmówić mu popularności. Przedstawiamy 10 przydatnych skryptów do wykorzystania na stronach.
Jeśli nie stanowi to dużego problemu technicznego, to strony powinny {link_wew 6443}działać poprawnie bez JavaScriptu{/link_wew}. Może on być niedostępny na komórkach lub zanim witryna załaduje się do końca.
Jeśli jednak decydujemy się na naszpikowanie strony skryptami, warto wykorzystać gotowe rozwiązania. Przedstawiamy 10 nowych lub przydatnych skryptów i pluginów używających jQuery. Większość z nich oparta jest o semantyczny kod i działa nawet w ekstremalnych sytuacjach.
Easy slider 1.7
http://cssglobe.com/post/5780/easy-slider-17-numeric-navigation-jquery-slider
Mocno konfigurowalny i łatwy w użyciu skrypt służący do płynnego przewijania obrazków znajdujących się na stronie. Gotowy do ściągnięcia skrypt charakteryzuje się ładnym wyglądem domyślnym, ale oczywiście można go dostosować do swoich potrzeb.
Płynnie rozwijane menu
http://buildinternet.com/2009/01/how-to-make-a-smooth-animated-menu-with-jquery/
Tutorial pozwalający na stworzenie menu, w którym po najechaniu na element płynnie rozwinie się pole z jego opisem. Zarówno kod oparty na listach jak i jak wygląd są bardzo estetyczne. Sam skrypt mieści się zaledwie w kilku linijkach. Leniwi mogą pobrać gotowy efekt pracy.
Coda Popup Bubbles
http://jqueryfordesigners.com/coda-popup-bubbles/
Efektowny skrypt pozwalający na dodanie dymków z opisem elementu. W przykładzie wykorzystano go do pokazania szczegółowych informacji o pobieranym pliku. Dzięki semantycznemu zastosowaniu tabel dane wyświetlają się poprawnie nawet bez arkusza stylów.
Jcrop
http://deepliquid.com/content/Jcrop.html
Zaawansowane narzędzie do przycinania obrazków. Pozwala na dodanie do grafiki miniatury, zachowanie stosunku krawędzi po przycięciu i kila innych funkcji. Na obszar poza przycięciem może zostać nałożony dowolny styl. Po wyłączeniu JavaScriptu widać jedynie początkowy obraz. Wydany na licencji MIT.
Coda slider 2.0
http://www.ndoherty.biz/demos/coda-slider/2.0/
Znany od dwóch lat skrypt coda-slider doczekał się drugiej wersji. Służy do dynamicznej zmiany treści znajdującej się w kontenerze i wykorzystuje charakterystyczny efekt przesunięcia tekstu. Skrypt można zastosować zarówno na stronach prywatnych jak i komercyjnych – został wydany na licencjach MIT i GPL.
Komentarze jak z Facebooka
http://www.9lessons.info/2009/06/submit-multiple-forms-jquery-ajax.html
Nieco bardziej skomplikowany, bo wymagający współpracy na poziomie PHP – JavasScript, skrypt pozwalający na dynamiczne dodanie pola komentarzy w wielu miejscach na jednej stronie. Dokładnie tak jak na Facebooku.
Kalendarz jak od Apple
http://www.stefanoverna.com/log/create-astonishing-ical-like-calendars-with-jquery
Kalendarze na stronach zwykle tylko przeszkadzają, ale są miejsca, w których okazują się przydatne (np. w archiwach). Skrypt udający iCal, znany z Mac OS, jest jednym z ładniejszych jakie udało nam się znaleźć, a w dodatku dobrze integruje się z WordPressem.
Podświetlenie aktualnego pola
http://css-tricks.com/improved-current-field-highlighting-in-forms/
Prosty, ale efektywny skrypt do poprawy wyglądu formularzy. Przy wypełnianiu pola podświetlane jest nie tylko ono, ale również cały wiersz w formularzu. W połączeniu ze sprawdzaniem poprawności formularzy efekt będzie bardzo ciekawy.
Testowanie formularzy
http://www.position-absolute.com/articles/jquery-form-validator-because-form-validation-is-a-mess/
Skrypt Cedrica Dugasa to prosty sposób na testowanie formularzy. Mimo że podpowiedzi są raczej brzydkie, to sam kod działa bardzo dobrze i pozwala wychwycić wiele błędów zanim użytkownik wyśle formularz do walidacji po stronie serwera.
W ramach zapłaty możemy (ale nie musimy) postawić autorowi piwo. 6 złotych za taki skrypt? Z pewnością warto!
Dynamiczne tworzenie wykresów
Plugin do jQuery wykorzystuje HTML5 do dynamicznego generowania wykresów na podstawie danych tabelarycznych. Stworzony wykres możemy edytować. Co ważne, skrypt działa również pod IE6! Do jego obsługi nie jest potrzebny CSS, ale użytkownicy niekorzystający z JavaScriptu nie zobaczą nic.