Lytebox umożliwia pokazanie pojedynczego zdjęcia, ale też można dzięki niemu prezentować całe galerie zdjęć czy nawet utworzyć pokaz slajdów.
\ http://www.dolem.com/lytebox/
Przy użyciu lyteboxa można również dodać dodatkową treść na stronie. Np. w lyteboxie możemy umieścić wyszukiwarkę google.
Aby korzystać z efektu lytebox na swojej stronie należy ściągnąć skrypt. Skrypt ten można pobrać ze strony autorów: http://www.dolem.com/lytebox/.
Po ściągnięciu, należy wejść w tryb edycji swojej strony i wykonać kilka modyfikacji w kodzie.
Należy dodać poniższy kod do sekcji <head> dokumentu:
<script type=”text/javascript” language=”javascript” src=”lytebox.js”></script>
<link rel=”stylesheet” href=”lytebox.css” type=”text/css” media=”screen” />
Następnie należy dodać do każdego zdjęcia odpowiedni atrybut “rel” dla typu w jakim chcemy wyświetlać lytebox. Na przykład może to być:
<a href=”images/image-1.jpg” rel=”lytebox” title=”Image Description”>Image #1</a>
Dla pojedynczego obrazu.
Dla grupy elementów wpisujemy kod:
<a href=”images/image-1.jpg” rel=”lytebox[vacation]” title=”Mom and Dad”>Mom and Dad</a>
<a href=”images/image-2.jpg” rel=”lytebox[vacation]” title=”My Sister”>My Sister</a>
Jeżeli chcemy dodać pokaz slajdów dodajemy poniższy kod. Należy zwrócić uwagę że nazwa lytebox zmieniła się na lyteshow
<a href=”images/image-1.jpg” rel=”lyteshow[vacation]” title=”Mom and Dad”>Mom and Dad</a>
<a href=”images/image-2.jpg” rel=”lyteshow[vacation]” title=”My Sister”>My Sister</a>
Lytebox działa na większości przeglądarek jednak niestety, nie na wszystkich. Użytkownicy Safari, Netscape czy typowych przeglądarek Linuksowych mogą mieć problem z działaniem tego typu narzędzi.
Korzystaliście kiedyś z Lyteboxa? Jak wrażenia? Dajcie znać.