Miesięczne archiwum: Lipiec 2011

Raphaël – biblioteka JavaScript to grafiki wektorowej

raphael

Raphaël to biblioteka JavaScript, która w znacznym stopniu upraszcza pracę z grafiką wektorową. Pozwala na tworzenie  w prosty sposób własnych wykresów, animacji galerii itp. Biblioteka Raphaël używa SVG, który jest standardem ustalonym przez W3C i VML jako bazy do tworzenia grafiki. Oznacza to, że do każdego obiektu graficznego tworzony, jest obiekt DOM, dzięki temu można dołączyć obsługę zdarzeń JavaScript.  Raphaël działa na przeglądarkach Firefox 3.0 +, Safari 3.0 +, Chrome 5.0 +, Opera 9.5 + i Internet Explorer 6.0 +.

 Demo: http://raphaeljs.com/
Licencja: MIT

Screenfly – sprawdź jak będzie wyglądała strona na rożnych urządzeniach

screenfly

Screenfly to internetowa aplikacja, która pozwala sprawdzić jak wyglądają strony na rożnych uradzeniach. Aplikacja działa bardzo prosto, wystraszy wpisać adres internetowy strony. W lewym menu możemy zmieniać urządzenia oraz rozdzielczość. Z urządzeń do dyspozycji mamy monitor komputera, tablet, telefon komórkowy oraz telewizor. Każde z tych urządzeń dysponuje różnymi rozdzielczościami, właściwymi dla danych modeli.

Link: http://quirktools.com/screenfly/

Joint – jak stworzyć interaktywny diagram UML w jQuery

joint

Biblioteka Joint daje możliwość stworzenia interaktywnych diagramów. Możemy tworzyć zarówno proste organizacyjne diagramy, jak i bardziej skomplikowane diagramy relacji, diagramy maszyn stanowych, diagramy klas itp. Obiekty diagramu możemy przesuwać po po ekranie i łączyć z rożnego rodzaju łącznikami.

Framework: jQuery
Link: http://www.jointjs.com/
Demo: http://www.jointjs.com/demos.html
Licencja: MIT

fontsquirrel.com – wyświetlaj dowolną czcionkę na stronie

fontsquirrel

Standardowe czcionki w stylach CSS przestają być wystarczające. Z pomocą przychodzą nowe technologie CSS3 a dokładnie @Font-Face. Na stronie fontsquirrel.com można pobrać najróżniejsze czcionki i wyświetlić je na stronie WWW tak, aby były widoczne na każdej przeglądarce. Należy pamiętać że czcionki nie wyświetlają polskich znaków. Nie należy się jednak martwić, bowiem na stronie dostępny jest generator. Wybierając czcionkę, która obsługuje „ogonki” i ustawiając odpowiednie parametry, można wygenerować poprawne czcionki. Spakowany plik, który ściągniemy zawierać będzie czcionki w rożnych formatach wraz z przykładem w pliku HTML.

Link: http://www.fontsquirrel.com/

haz.io – Sprawdź kompatybilność przeglądarki

haz.io

Aplikacja internetowa, która umożliwia sprawdzenie przeglądarki pod kontem obsługi CSS3, HTML5, nowych rodzajów znaczników oraz atrybutów. Zielona ikona znaczy że dana technologia jest obsługiwana a czerwona, że nie jest. Każda przeglądarka rożni się ilością obsługiwanych technologii, dlatego realizując projekt warto wziąć to pod uwagę tę różnice. Oczywiście w raz z rozwojem przeglądarek ich możliwości będą wzrastać. Pewnie nie będzie dla nikogo zaskoczeniem, że przeglądarka IE9 wypada w tych testach najgorzej :)

Link: http://haz.io/

The Wall – galeria w MooTools – nie tylko sam skrypt cieszy oko :P

The Wall MooTools plugin

Skrypt galerii napisany na frameworku MooTools. Galeria umożliwia przeglądanie obrazów w formie Walla (ściany). Cały wall z obrazami może się przesuwać w rożnie kierunki, wczytując następne zdjęcia. Można ustalić, że niektóre kolumny przesuwają się w górę, a inne w dół lub też przesuwać każde zdjęcie oddzielnie. Do galerii można dołączyć menu nawigacyjne, lub przycisk losowego wyboru zdjęć. Dodatkową zaletą jest to, że można tworzyć maski na walla, to znaczy przykryć galerię innym dużym obrazkiem z przeźroczystymi niektórymi elementami. Zdjęcia do galerii można wczytywać między innymi przy zastosowaniu JSON.

Framework: MooTools
Link: http://wall.plasm.it
Demo: http://wall.plasm.it/examples/
Licencja: MIT

jQuery EasyUI – nieoficjalna biblioteka jQuery

easyui jquery

Jak wiemy albo i nie :) – jQuery UI jest oficjalną biblioteką jQuery wzbogacającą możliwość tworzenia zaawansowanych interfejsów. Jednak oprócz niej istnieją inne nieoficjalne biblioteki korzystające z jQuery. Jedną z takich bibliotek jest jQuery EasyUI. Każda funkcja jest oferowana jako oddzielne wtyczki. Wtyczki obejmują przeciągnij-upuść, paginacje, zakładki, panele, menu, formy, walidacje, okna, tabele itp. Plusem dla biblioteki jest to, że obsługuje wielojęzyczność oraz jest bardzo dobrze udokumentowana.

Framework: jQuery
Demo: http://www.jeasyui.com/demo/index.php
Download: http://www.jeasyui.com/download/index.php
Licencja: GPL

Supersized – galeria na pełnym ekranie w jQuery

supersized-gallery jquery

Rewelacyjna galeria, która pozwala wyświetlać zdjęcia na całym ekranie. Skrypt rozciąga i układa zdjęcia tak, aby pasowały do ekranu. Istnieje kilka sposobów przeglądania zdjęć, możemy je wyświetlać w formie galerii lub jako tło strony. Zdjęcia mogą być losowane lub na przykład pobierane z portalu. Na stronie skryptu można poczytać dokumentacje, która szczegółowo opisuje możliwości konfiguracyjne galerii.

 Framework: jQuery
Demo: http://buildinternet.com/project/supersized/demo.html
Licencja: GPL, MIT