TomStardust.com
Web Design, accessibilità, XHTML e CSS
Sei qui: Homepage » javascript, risorse utili » Thickbox 3: ecco le novità
mag 11 2007
Thickbox 3: ecco le novità
Thickbox è un Javascript di cui ho già parlato in passato, che consente di aprire immagini, iframe e nuove pagine all’interno della stessa finestra in cui si naviga.
La novità di questi giorni è l’uscita della versione 3, a poco tempo dalla versione 2.1. Dal blog dell’autore, ecco l’elenco dei principali miglioramenti:
- Se non viene impostata una dimensione per l’apertura di contenuto inline, iframe o AJAX, la finestra avrà di default 630px di altezza e 440px di larghezza
- Il codice è stato ripulito utilizzando JSLint, il file thickbox.js è stato compresso ulteriormente
- Aggiornamento per utilizzare la versione 1.1.2 di jQuery
- L’immagine di caricamento è stata cambiata ed ora viene precaricata
- Lo script ora funziona con le mappe immagini e con gli elementi input dei form oltre che con i semplici links (il tag a)
- Maggiore integrazione con AJAX, per caricare nuovi contenuti in una finestra di Thickbox già aperta
Le novità sono rilevanti, probabilmente interesseranno di più chi vorrà utilizzare questo Javascript integrandolo con AJAX. E’ una valida alternativa ad altri script analoghi, spesso molto più pesanti: l’attuale versione pesa solo 10kb nella versione compressa, a cui vanno aggiunti circa 20kb di jQuery.
Potete trovare esempi, guide per l’installazione di Thickbox 3 ed ovviamente i file da scaricare sul sito ufficiale.
Usi Twitter?
13 maggio 2007 alle 15:13
ItaliaLo script è molto interessante.
Ho notato dal sito che la compatibilità è garantira con i principali browser, ma nel caso di javascript disattivato cosa accade?
14 maggio 2007 alle 08:24
GrazitalyOttimo, installata.
Pare fatto veramente bene!
14 maggio 2007 alle 18:36
Izzyweb.itbella idea adesso lo installo
grazie per tenerci sempre informati sulle novità
2 giugno 2007 alle 14:01
GiacomoNon mi piace granchè, trovo l’effetto di comparsa della finestra un pò troppo “rude”, preferisco la litebox basata su prototype light e moo.fx
ciao
14 luglio 2007 alle 16:18
Vacanze CalabriaSono daccordo con Giacomo, l’aspetto grafico è molto spigoloso e il fadein e out della finestra è troppo brusco, la litebox è molto più elegante!
6 maggio 2008 alle 15:05
AnonimoChe sia uguale a GreyBox?
7 luglio 2008 alle 14:59
Magikciao, scusate, in questa pagina: http://magiksite.altervista.org/galleriaimmaginikenilguerrierolaleggendadihokuto01.html ho usato questo script, la cosa che mi serviva era che mi ridimensionava le immagini se erano troppo grandi, ma nn so per quale motivo, eppure mi sembra tutto corretto come cose, le immagini si mettono in alto, e nn al centro, e se scorro la pagina rimangono in alto, nn stanno sempre al centro anche se la pagina scorre, mi sapreste dire come mai? ma questo nn mi capita se vedo la demo sul sito del creatore dello script, uso IE 7 grazie
10 novembre 2008 alle 22:05
giulioScusate ragazzi, ma ho notato un problema nello script: se c’è nella pagina un’applet java il box non riesce a nasconderla e l’applet risulterà essere sempre in primo piano bella luminosa.
C’è un modo per nasconderla? Nel forum ufficiale nessuno ne parla.
Spero che qualche cervellone mi venga in soccorso
11 novembre 2008 alle 09:20
Tom@giulio: pare che il tuo problema sia diffuso sia con Lightbox che con Thickbox o altri script. Forse si potrebbe risolvere modificando il JavaScript in modo che nasconda l’applet al caricamento del lightbox, ma non ne sono sicuro. In ogni caso se fossi al tuo posto cercherei di liberarmi dell’applet Java :)
11 novembre 2008 alle 10:16
giulioCiao Tom, grazie per la risposta. In effetti il problema credo sia comune a molti, con lo script lightbox ero riuscito a risolverlo modificando una stringa, in particolare questa:
$$(‘select’, ‘object’, ‘embed’, ‘applet’).each(function(node){ node.style.visibility = ‘hidden’ });
aggiungendo semplicemente il tag applet tra quelli che dovevano essere nascosti, nello scipt thickbox, dato che non sono un programmatore, non sono riuscito a trovare niente del genere, ho comunque chiesto aiuto al forum dello script thickbox, vediamo se qualcuno ci può illuminare!
23 maggio 2009 alle 12:55
matteoSapete dirmi se lo script funziona per liste di immagini xml?
19 giugno 2009 alle 08:36
christianCiao a tutti,
secondo Voi è possibile aprire il modulo Gmap (Flash) all’interno di tickbox??
Grazie
19 giugno 2009 alle 18:07
Tom@christian: sì, Thickbox può essere usato anche per includere pagine html, quindi puoi inserirci qualsiasi cosa, anche Flash.
28 dicembre 2009 alle 16:47
MircoBuongiorno a tutti,
nn ci capisco nulla, qualcuno può aiutarmi?
Dopo aver inserito:
script type=”text/javascript” src=”path-to-file/jquery.js”
script type=”text/javascript” src=”path-to-file/thickbox.js”
e l’HTMl sulle immagini:
a href=”images/plant1.jpg” title=”add a caption to title attribute / or leave blank” class=”thickbox” rel=”gallery-plants”><img src="images/plant1_t.jpg" alt="Plant 1" /
ho copiato i 2 files jquery.js e thickbox.js su due file esterni (è corretto???).
Dopo di che non ho capito cosa devo fare, potete darmi una mano?
PS: non mi copiava i links… :(
grazie mille, ciao
21 maggio 2011 alle 18:17
GiovanniCiao Tommy, hai proprio ragione! Io nella versione attualmente on-line del sito del maneggio dove vado sto usando il Lightbox ma nella nuova versione grafica riveduta e corretta, che andrà a sostituire la vecchia fra qualche settimana, ho deciso di passare a Thickbox anche dopo aver letto il tuo articolo.
Tra l’altro, cosa ancora migliore, WordPress (con cui ho sviluppato il sito) supporta già di default Thickbox!
Bastano poche righe di inclusione di codice e il gioco é fatto!
In pratica nell’header và scritto questo:
Nel footer invece questa riga:
Ciao e al prossimo utile articolo.
Giovanni