Články
Slimbox - galerie pro každého
Fotogalerie, která je příjemná pro autory webů i jejich návštěvníky.
Jednoduchá javascriptová galerie vychází z konstrukce Lightbox. Základní vlastnosti jsou podobné, funkčnost je zajištěna frameworkem Mootools. Ten patří mezi složitější javascriptové produkty. Svědčí o tom i jeho velikost, textový soubor má 45 kB, což je na skript poměrně hodně. Nabízí ale velmi zajímavé prostředky pro fungování fotogalerie, navíc v kódu, který je validní podle W3C.
Adresář Slimbox obsahuje tři podadresáře, ze kterých je nejsrozumitelnější ten s CSS. Obsahuje i grafická tlačítka s anglickým textem. Jejich nahrazení češtinou pomocí nových obrázků (GIF) je otázkou několika minut.
Galerie otvírá snímky do nového okna, celá akce je v animaci a probíhá poměrně rychle. Tento náhled je možné doplnit i textem k fotografiím. Skript odkazuje na vlastní CSS soubor, který upravuje nové okno se snímkem. V přiloženém demo souboru (example.html) jsou kaskádové styly uvedeny přímo v kódu. Pokud vsazujete galerii do svého designu, tuto část kódu vymažte, je pro vás zbytečná. Naopak, ve svém externím CSS souboru si vytvořte nové bloky pro malé náhledy. Okno se zvětšenou fotografií je formátováno vlastním souborem s kaskádovými styly (slimbox.css), který je čitelný a snadno upravitelný. Ukázka možného zápisu cesty ke snímkům:
<a href="slozka/obrazek.jpg" rel="lightbox" title="Komentář k obrázku">
<img src="slozka/obrazek.jpg" height="80" alt="Alternativní text" /></a>
V hlavičce stránky (head) je třeba uvést cestu k příslušným skriptům. Poslední řádek vede k CSS souboru, který se týká náhledového okna se zvětšeným snímkem.
<script type="text/javascript" src="js/mootools.js"></script>
<script type="text/javascript" src="js/slimbox.js"></script>
<link rel="stylesheet" href="slimbox/css/slimbox.css"
type="text/css" media="screen" />
Fotogalerie pracuje spolehlivě. Vyzkoušel jsem ji v prohlížečích Firefox, Internet Explorer, Opera, Konqueror a Google Chrome a nikde nedošlo k žádným nečekaným reakcím. Pouze linuxový Konqueror si ji zpracoval po svém, ale fungovala.
Lightboxové galerie se objevují na webech stále častěji. Jejich začlenění do webu je velmi jednoduché, navíc stačí použít prostor jen pro HTML, bez požadavků na PHP. To je i u placeného poskytovatele nejlevnější varianta.
Slimbox je ke stažení na mateřském webu a určitě stojí za vyzkoušení. V odkazu pod článkem je ukázka fungování galerie.
>>>>>
22-10-2008