Qualcuno potrebbe dire - e non a torto - basta! Di librerie Javascript (Unobtrusive - non intrusive, o parzialmente) per gestire immagini e gallerie ce ne sono davvero tante. Comunque sia ecco la lista, con pregi e difetti, delle migliori che ho provato.
SLIMBOX 1.41
Estremamente minimale, 7K (alla versione 1.41), richiede mootools per funzionare. Come indicato sulla Home page è un vero e proprio clone grafico di Lightbox, che vedremo più sotto. Sinceramente, a parte l'estrema compattezza della libreria, non possiede caratteristiche peculiari. Sullo stesso sito, comunque, è possibile trovare anche uno script per generare riflessioni runtime... al limite può essere utile questo 
Voto: --6 - Home Page Slimbox, Home Page Reflection.js for MooTools
LIGHTBOX2
Una delle più note e semplici. Gestisce in questa release sono immagini (quindi non funziona con QuickTime, Flash o altro). Per il suo funzionamento richiede Prototype e Scriptaculous. Usa l'attributo rel per identificare i link delle immagini da processare:
HTML:
-
<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1
</a>
Come le altre librerie che vedremo, supporta la modalità slideshow, inserendo tra parentesi quadre un qualsiasi identificativo in una serie di link/image:
HTML:
-
<a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1
</a>
-
<a href="images/image-2.jpg" rel="lightbox[roadtrip]">image #2
</a>
-
<a href="images/image-3.jpg" rel="lightbox[roadtrip]">image #3
</a>
Voto: 6 - Home Page Lightbox2
LIGHTWINDOW 2.0
Anche questa è abbastanza diffusa! Dopo tutto come capire qual'è la più usata? ;). Comunque sia è estremamente completa e versatile. Sul sito campeggia la richiesta di donazioni per l'acquisto di un Mac... un tantino invasiva e pressante... Comunque sia, come la precedente, per il suo funzionamento, richiede la presenza di Prototype e Scriptaculous. A differenza della precedente, tuttavia, questa permette di visualizzare moltisiimi tipi di file: dalle immagini, filmati QuickTime, filmati Flash, pagine HTML esterne e PDF. Di contro, utilizza vari attributi, alcuni facoltativi (author, caption e title) altri obbligatori (class e params - per impostare il comportamento della libreria). Ad esempio, per visualizzare una gallery o slideshow usa l'attributo rel:
HTML:
-
<a href="gallery/0-sushi.jpg" class="lightwindow" rel="[Sushi]" title="Left Behind" caption="Look's super tasty!" author="Unknown">image #1
</a>
-
<a href="gallery/1-sushi.jpg" class="lightwindow" rel="[Sushi]" title="Beware of warewolves..." caption="I shouldn't be doing this when I am hungry" author="Unknown">image #2
</a>
-
<a href="gallery/2-sushi.jpg" class="lightwindow" rel="[Sushi]" title="That was good!" caption="Take that sushi!" author="Unknown">image #3
</a>
Voto: 8 - Home Page LightWindow 2.0
SHADOWBOX 1.0B
Nonostante sia alla versione 1.0 beta, questa è forse la libreria più completa, sia dal punto di vista funzionale sia per le librerie supportate. Per il suo funzionamento, infatti, è possibile scegliere tra una serie di framework, grazie a dei file "adapter" appositamente realizzati e fornite dall'autore:
L'effetto visivo (configurabile tramite skin/css), poi, a differenza delle altre, è sicuramente più accattivante. Gli attributi usati sono solo il rel dove, al sue interno, trovano spazio tutti gli altri parametri di configurazione. Ad esempio, per realizzare una gallery, basta usare:
HTML:
-
<a href="beach.jpg" rel="shadowbox[Vacation]">The Beach
</a>
-
<a href="pier.jpg" rel="shadowbox[Vacation]">The Pier
</a>
Se si desidera impostare qualche opzioni (vedi sito per la lista completa) basta usare la seguente sintassi:
HTML:
-
<a href="myimage.jpg" rel="shadowbox;options={overlayOpacity: 0.5, resize: false}">My Image
</a>
Su Internet se ne possono trovare anche altre, come ad esempio Highslide JS. Anzi, se volete segnalarmi qualche altra libreria... Comunque sia, personalmente, preferisco Shadowbox per semplicità, scalabilità e cross-framework.
Voto: 9 - Home Page Shadowbox 1.0B
Post correlati
Tramite un pannello (vedi immagine qui a sinistra) con una serie di "spunte" (checkbox), che indicano le varie caratteristiche delle librerie, è possibile eseguire un filtro ottenendo così la lista di una o più librerie che fanno al caso nostro. Speriamo che l’autore mantenga aggiornata questa fantastica pagina, utilissima nel districarsi tra le numerose e sempre più potenti librerie di questo tipo.
7 commenti »
