Pewien czas temu znalazłem w sieci, gdzieś na jakiejś stronie bardzo ładnie wyglądający efekt powiększania obrazka. Jest on widoczny na moim blogu od jakiegoś czasu:

Jak widać na powyższym zrzucie po kliknięciu w obrazek na blogu jesteśmy przenoszeni do pełnego wymiaru klikniętego obrazka, ale żeby to nie wyglądało tak brzydko, podczas kliknięcia uruchamiany jest plik lightbox.js i lightbox.css plus do tego trzy pliki graficzne; overlay.png, close.gif i loading.gif.
Aby zaimplementować ten ładny efekt na naszej stronie wystarczy do kodu strony dopisać w <head> następujący fragment:
<link rel="stylesheet" href="lightbox/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="lightbox/lightbox.js"></script>
U mnie skrypt i arkusz stylów znajduje się w katalogu lightbox.
Po dodaniu tegoż kodu, aby zadziałał nam skrypt i żebyśmy zobaczyli ten efekt to do odnośnika, który prowadzi do obrazka, który chcemy zobaczyć musimy dodać atrybut rel="lightbox". Powyżej pokazany jest obrazek będący odnośnikiem, a teraz kliknij zwykły odnośnik wywołujący ten efekt. Jego kod:
<a href='http://medeco.p9.pl/wordpress/wp-content/uploads/2007/02/podglad_obrazkow.png' title='Tytuł odnośnika' rel="lightbox">kliknij zwykły odnośnik</a>
Oprócz atrybutu rel możemy dodać atrybut title, który zostanie wyświetlony jako tytuł naszego powiększonego obrazka.

Ok, efekt ładny i przyda Wam się na pewno. Robi wrażenie. Chciałbym Was jeszcze prosić, o to że gdyby ktoś znał autora skryptu niech poda – bo ja nie pamiętam nawet z jakiej strony to “podwędziłem”
Całość załączam w spakowanym zipem folderze: lightbox.zip