Miesięczne archiwum: Styczeń 2011

Paginacja z użyciem Ajax i PHP

super_paging Ajax PHP

Prosta i łatwo w użyciu paginacja stron. Do dzielenia na strony skrypt wykorzystuje PHP a do wczytywania informacji z poszczególnych stron jest wykorzystywana technologia AJAX. Poszczególne rekordy są odczytywane z bazy danych.

Aby zainstalować przykład trzeba otworzyć baze danych „records” w niej tabele równierz „records” i dodać trzy pola pierwsze „id”-integer (klucz główny), „message” – varchar i pole „image” też varchar. W polu imege dajemy linki do obrazków a w polu message tekst. Trzeba również pamiętać o prawidłowym haśle do bazy danych bo skrypt nie wyświetla żadnych komunikatów o błędzie.

super_paging Ajax PHP

Wymagania: PHP, MySql, jQuery
Demo: http://demos.99points.info/super_paging/
Link: http://www.99points.info/2011/01/ajax-pagination-using-jquery-and-php-with-animation/
Licencja: Darmowa

Spritely – animowane logo z użyciem jQuery

spritely jQuery

To jeden z ciekawszych skryptów napisanych w jQuery. Dzięki niemu możemy tworzyć ciekawe animowane tła lub animowane logo. Stosując dodatkowo bibliotekę jQuery IU, możemy umieszczać w animacji obiekty, które możemy przesuwać po stronie za pomocom myszki. Skrypt działa na wszystkich popularnych przeglądarkach oraz na telefonach iPad i iPhone. Na stronie skryptu znajduje się dokumentacja jak używać skrypt oraz znajduje się na niej dużo odnośników do innych stron które wykorzystują ten skrypt.

Wymagania: jQuery
Demo: http://spritely.net/
Licencja: MIT, GPL

Contactable – szybki kontakt dzięki PHP, jQuery i Ajax

Contactable plugin jQyery Ajax

Bardzo często na różnych stronach widuje wysuwany z boku formularz kontaktowy. To bardzo popularny ostaniami czasy plugin. Pomyślałem że opisze go na blogu, aby łatwiej go było znaleźć. Tak więc plugin wyświetla na stronie małą zakładkę po naciśnięciu której, wysuwa nam się z boku formularz kontaktowy. Po wypełnieniu pól, formularz sprawdza czy dane są poprawnie wpisane i przesyła maila. Do skryptu dołączony jest plik PHP w którym trzeba wpisać adres mail na który ma przychodzić mail z formularza.

Contactable plugin jQyery Ajax

 

Wymagania: jQuery, PHP
Demo: http://plugins.theodin.co.uk/jquery/contactable/index.html
Link: http://theodin.co.uk/blog/ajax/contactable-jquery-plugin.html
Licencja: Darmowa

TipTip – alternatywny tooltip w jQuery

tip tip jquery

W znacznikach HTML możemy używać znacznika title do opisywania zawartości tagów. Na przykład możemy opisywać nimi linki lub zdjęcia.

przykład:

<a href=”" title=”This will show up in the TipTip popup.”>

<img src=”image.jpg” title=”A picture of the World” />

Po najechaniu na te elementy wyskakuje toolTip z zawartością atrybutu title. Niestety standardowy tooltip jest brzydki oraz nie ma efektu przejścia. Alternatywą dla standardowego tooltipa może być TipTip. Skrypt umożliwia napisanie własnych stylów do okienka oraz jego animacje. Na stronie autora skryptu można obejrzeć video, które szerzej pokazuje możliwości skryptu.

tip tip jquery

Wymagania: jQuery
Demo: http://code.drewwilson.com/entry/tiptip-jquery-plugin
Licencja: MIT. GPL

Webportio – zbiór grafik dla Adobe Fireworks

webportio

Fireworks to narzędzie graficzne do projektowania głównie stron internetowych. Moim zdaniem jest lepszy w tym od Photoshop, ponieważ jest przeznaczony dokładnie do tego. Photoshop jest bardziej sprawny przy obróbce zdjęć, a nie tworzeniu grafiki. Za wykorzystaniem Fireworks do stron www, przemawia również różnica w cenie kilku tysięcy :).

Na stronie www.webportio.com możemy znaleźć bardzo dużo elementów graficznych, które możemy używać z programu Fireworks lecz nie tylko. Znajdziemy miedzy innymi przyciski, kalendarze, ikony, menu, formularze i inne. Wszystkie grafiki są w formacie png. z zapisanymi warstwami

webportio

Link: http://www.webportio.com/

Skrypt paska przewijania ( Scrollbar ) w jQuery

Custom Scrollbar jQuery plugin

Takie skrypty to prawdziwe perełki, ponieważ rzadko można znaleźć skrypty modyfikujące kontrolki formularzy. Ten skrypt zmienia wygląd paska przewijania. Mamy do dyspozycji kilka rodzai wyglądu paska. Możemy przewijać zawartość zarówno w pionie jak i w poziomie. Użycie takiej formy przewijania tekstu z pewnością wygląda lepiej niż tradycyjna kontrolka.

Custom Scrollbar jQuery plugin

Framework: jQuery
Demo: http://manos.malihu.gr/tuts/jquery_custom_scrollbar.html
Licencja: Darmowa