Shadowbox: o lumină de fapt


Acum câteva săptămâni scriam despre clonele Lightbox. Nu credeam că subiectul îmi va fi de folos atât de rapid. Dar săptămâna aceasta m-am trezit cu o nevoie complexă: Papa Benedict se află în vizită în SUA (şi avem mult de lucru la Catholica.ro, de aceea puţin şchioapătă ritmul aici) şi am vrut să fac o secţiune specială în care să strâng texte, fotografii, materiale video… Iar ShadowBox s-a potrivit ca o mănuşă. Nici vorbă de umbre, acest script a aruncat doar lumină şi mi-a provocat sincer bucurie.

img49

Evident, demonstraţii ale scriptului găsiţi pe pagina lui (tocmai am pus mai sus linkul) sau puteţi vedea ceea ce am făcut eu pe Catholica.ro pentru texte, fotografii şi materiale video. Funcţionează ca uns (eh, evident că nu am ajuns să fac teste cu toate navigatoarele din lume, cu toate versiunile lor)! Practic vizitatorii pot să defileze printre zeci de fotografii sau texte fără să mai încarce o altă pagină: totul se încarcă "deasupra", conform principiului scripturilor Lightbox. Dar două sunt lucrurile care m-am fermecat cel mai mult:

1. faptul că acoperă o paletă atât de largă de elemente afişabile "deasupra" şi

2. faptul că scriptul este compatibil cu mai multe librării tradiţionale de scripturi.

Să o luăm cu începutul. Practic orice doriţi poate fi afişat cu acest script: imagini, clupuri QuickTime, Windows Media Player, Flash, HTML şi pagini web externe. Pentru pagina dedicată vizitei în SUA am avut surse variate: de la YouTube la FLV-uri şi WMF-uri. Formate diferite dar totul arată extrem de unitar. Iar principiul galeriilor de imagini este extins practic la orice element doriţi să folosiţi: galerii de clipuri video, galerii de pagini web externe… ce doriţi!

Al doilea atu este de asemenea extraordinar: sunteţi fani jQuery sau MooTools sau ExtJS sau altele? Nu are importanţă. Da, aţi citit bine: nu are importanţă. Acest script are o idee trăznită şi de aceea genială: foloseşte o serie de adaptori pentru librăria JavaScript favorită. Pentru a folosi scriptul (deja pe Catholica.ro mergând pe mâna la jQuery) a trebuit pe lângă shadowbox.js să includ anterior adaptorul shadowbox-jquery.js. Ceva de genul:

<link rel="stylesheet" type="text/css" href="caleadvs/shadowbox.css" />
<script type="text/javascript" src="caleadvs/jquery.js"></script>
<script type="text/javascript" src="caleadvs/shadowbox-jquery.js"></script>
<script type="text/javascript" src="caleadvs/shadowbox.js"></script>

Atenţie însă la un lucru: dacă vi se pare că scriptul nu merge bine aproape sigur că nu e problema scriptului. Adăugaţi înainte de tagul html acest indicator

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Acum probabil v-aţi aştepta să scriu cum se foloseşte scriptul. Nu e cazul. Ca în orice clonă Lightbox, tot ce trebuie este să adăugaţi unui link ceva de genul rel="shadowbox" şi dacă acel link duce la o imagine, ori pagină web, ori flash, ori ştiu eu ce, nu se va mai deschide într-o nouă pagină ci într-o fereastră "deasupra". Sunt mulţi parametri pe care îi veţi descoperi din documentaţie în funcţie de nevoi. Evident că dimensiunea ferestrei este ajustabilă. Evident dacă creaţi o galerie (de orice) se poate trece de la un element la altul, mai mult: puteţi Dvs configura tastele – eu de exemplu am pus a şi u de la anterior şi următor. Evident modificând CSS-ul puteţi adapta aspectul sitului Dvs. Şi alte "evident" ar mai putea fi scrise.

Concluzia mea: scriptul ShadowBox este excelent şi dacă foloseaţi deja un script Lightbox, poate mai limitat, poate doar la imagini, upgrade-ul este banal (se reduce la codul din secţiunea head). Dacă ceea ce vă interesează este să aveţi cât mai multe pagini afişate, atunci scripturi gen Lightbox probabil nu vă interesează. Dar ar fi bine să vă gândiţi mai mult la experienţa de care are parte vizitatorul şi să daţi o şansă la astfel de scripturi.


Apreciază articolul:

1 stea2 stea3 stea4 stea5 stea (Neevaluat încă)
Loading...Loading...

0 comentarii


Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile necesare sunt marcate *