CSSREVOLT - blog personale di Filippo Buratti

Ho apportato numerose migliorie al mio script per l'apertura di ingrandimenti di immagini, un semplice lightbox leggero leggero. Perchè utilizzare uno script da almeno 30 kb quando con soli 4kb si può ottenere un effetto ugualmente gradevole? In fondo mi sono un po' inspirato alle vecchie e odiose popup,  che a mio modo di vedere costituiscono le antenate dei Lightbox dell'era web 2.0. Ricordo con affetto quei tempi quando con una riga di codice javascript si aprivano finestre a josa alla faccia degli utenti...

Tornando a Zoomy, la modifica principale riguarda il markup html, e in particolare l'adozione di 2 immagini per l'effetto (miniatura e ingrandimento): lo script precedente utilizzava solo l'immagine grande e una tecnica css di image replacement con overflow e text-indent che rendevano il codice non molto semantico riguardo ai suoi scopi.

Inoltre, allo scopo di precaricare le immagini, ho aggiunto la funzione imgPreloader, che ha anche contribuito alla rimozione di alcuni fastidiosi bug nel dimensionamento e posizionamento dello zoom, che ora sono più precisi.

Mi sarei ripromesso di implementare un diverso effetto di apparizione / scomparsa, e un indicatore di caricamento, ma al momento non se ne parla, sono molto impegnato nel lavoro e in progetti personal-lavorativi (la creazione di una newsletter avanzata e di un player per playlist di MP3 in Ajax senza l'uso di flash.

link: zoomy.js v2.0

Aggiornamento 27/01/2009 - con una piccola modifica al codice viene cambiata l'opacità delle thumbs cliccate.