Ecco LightBox 2!
Giovedì 30 Marzo 2006 - 13:40
di Alessandro Fulciniti
Dopo LightBox e diverse varianti, Lokesh Dhakar, autore della versione originale, ha presentato ieri Lightbox JS v2.0, una soluzione per avere ingrandimenti (e da questa seconda versione anche slideshow) di immagini nella stessa pagina.
Una tecnica notevole, che combina ora l’idea originale di LightBox con effetti di Script.aculo.us grazie anche all’uso di Prototype per ottenere transizioni e navigazione tra ingrandimenti davvero accattivanti. Due i nei della nuova soluzione: il peso (quasi 100Kb di Javascript) e la compatibilità cross-browser non dichiarata. Sto facendo un po’ di prove con la nuova beta di IE7 e sul primo ingrandimento visualizzato dal caricamento della pagina lo script ha qualche problema… non saprei se lo stesso problema si riscontra anche con IE6.
Categoria: Scripting | Permalink
Commenti
1
L’effetto è molto bello ma, anche mettendo il caso che lo script funzionasse su tutti i browser; per 100kb di javascript sono veramente troppi.
Se ci fosse una versione meno pesante mi piacerebbe usarla.
# - postato da kall3 - 30 Marzo 2006 - 13:59
2
Per ora preferisco usare la versione precedente, che rimane molto leggera, 100 kb con un 56k, solo per il JS è un’esagerazione
# - postato da Alessio Michelini - 30 Marzo 2006 - 14:31
3
Bello da vedere, ma anche io ho delle perplessità sul peso del javascript.
Oltre che su Firefox, su IE6 sembra funzionare bene.
4
Utilizzando un compressore javascript il peso complessivo del codice si riduce a circa 2/3
http://dean.edwards.name/packe.....r/
# - postato da Fabrizio Calderan - 30 Marzo 2006 - 14:53
5
utilizzando un compressore reale recuperi quasi 10 volte su quel tipo di testo ^^
# - postato da daniele_dll - 30 Marzo 2006 - 15:13
6
@Daniele: c’è qualche risorsa online in grado di effettuare una compressione maggiore? Evt puoi postare l’indirizzo?
Ciao
# - postato da Fabrizio Calderan - 30 Marzo 2006 - 15:16
7
Anch’io ho gli stessi dubbi per via dei 3 js da includere… Ma nel suo sito e su digg sono tutti entusuasti! L’effetto comunque è molto bello. :-)
Se conoscete qualche buon compressore fatevi sentire !
8
Simpatica la cosa, anche se molto lenta per via degli effetti dissolvenza… Non rilevo problemi su IE7, ma lo boccio… è troppo pesante… non vale la candela!
Preferisco la precedente versione, che anche più facilmente personalizzabile!
9
mannaggia!!
proprio ieri ho implementato sul mio sito la funzione Lightbox!!!E oggi è uscita la versione 2.0!!!!
neanche a farlo apposta!!
comunque penso che rimmarrò sulla prima versione, è più veloce e leggera, e poi l’ho studiata per un po’ e la conosco un po’ meglio…
Adesso mi metterò sotto con la seconda…
10
@Fabrizio Calderan
Grazie mille, con il compressore il Lightbox 1.0 passa da 13k a 5k !!!
11
Scusate l’ignoranza… ma come si usa il file compresso?! Ho provato ad usare il tool ma poi il js non mi funziona più…
Consuma la luce, non prende i soldi :-)
# - postato da daweb - 31 Marzo 2006 - 08:08
12
prototype.js [46k]
scriptaculous.js [2k] // che richiama effects.js [31k]
lightbox.js [19k]… come può pesare poco se si utilizzano 3 librerie per fare una cosa sola ?
Penso che una versione dedicata e identica riuscirebbe a pesare non più di 40Kb non compressa, ma ormai pare che se non c’è prototype e scriptacolous di mezzo non è un prodotto degno di nota … mai usate ste librerie e se questo è il peso, continuerò a non usarle.
Belline si … ma JS non dovrebbe diventare il nuovo SWF del WEB 2.0, imho.
13
concordo con andr3a: accettabile in pochi specifici contesti (come daltronde anche flash)
# - postato da Andrea Paiola - 01 Aprile 2006 - 07:44
14
salve,
desideravo sapere dove posso trovare le versioni precedenti di lightbox js; e come devo utilizzare il compressore javascript segnalato nei commenti prima? copio il codice che voglio comprimere…premo “pack”…poi clikko su “decode” ed infine “save”…però non funziona!!!
cmq mi preme sapere dove sono le versioni precedenti dello script…perchè vorrei capire come modificare la 2.0…
anzi lo anticipo qui così magari qualcuno mi aiuta:
1)vorrei spostare il tasto “close” dall’angolo basso a destra all’angolo in alto a destra
2)vorrei togliere la zona bianca che sta sotto l’immagine (quel bordo un po’ più spesso…dove ci vanno i commenti)
3)infine vorrei, che, come in qualche versione precedente (non ricordo quale), l’immagine facesse un resize nel caso fosse più grande della risoluzione del monitor (ovviamente con il tastino che mi permetta di ingrandirla)
qualcuno mi può aiutare???
help me…
grazie
15
salve,
desideravo sapere dove posso trovare le versioni precedenti di lightbox js; e come devo utilizzare il compressore javascript segnalato nei commenti prima? copio il codice che voglio comprimere…premo “pack”…poi clikko su “decode” ed infine “save”…però non funziona!!!
cmq mi preme sapere dove sono le versioni precedenti dello script…perchè vorrei capire come modificare la 2.0…
anzi lo anticipo qui così magari qualcuno mi aiuta:
1)vorrei spostare il tasto “close” dall’angolo basso a destra all’angolo in alto a destra
2)vorrei togliere la zona bianca che sta sotto l’immagine (quel bordo un po’ più spesso…dove ci vanno i commenti)
3)infine vorrei, che, come in qualche versione precedente (non ricordo quale), l’immagine facesse un resize nel caso fosse più grande della risoluzione del monitor (ovviamente con il tastino che mi permetta di ingrandirla)
qualcuno mi può aiutare???
help me…
grazie
16
Ho visto è uscito il plugin della versione 2.2 per wordpress:
http://www.4mj.it/lightbox-js-.....wordpress/# - postato da Luca - 08 Aprile 2006 - 13:14
17
Ciao,
sto usando lightbox 2 in un sito fatto in ASP, ma nel template del mio sito ho un’animazione flash e la finestra di lightbox si posizione dietro l’oggetto flash che non viene neanche oscurato… come faccio a portare la foto visualizzata in lightbox davanti all’animazione flash e a far oscurire anche questa insieme a tutto il resto della pagina? vi ringrazio x l’aiuto.
Buona giornata ;)Angela
# - postato da Angela - 26 Giugno 2007 - 19:09
18
Angela, immagino che il problema sia in IE..
prova a dare uno sguardo a questa pagina, dovrebbe fare al caso.# - postato da Alessandro Fulciniti - 27 Giugno 2007 - 08:01
19
Grazie per l’aiuto Alessandro… ora ho un’altro problemino, vorrei spostare la finestra della lightbox spostandola più in alto nella mia pagina; ho modificato il css ponendo a 0 i valori “top” del posizionamento assoluto, ma non succede nulla. Avete qualche suggerimento?
Grazie, Ciao
# - postato da Angela - 05 Luglio 2007 - 19:26
20
IMHO lightbox è totalmente inutile.
Ovvero, lo zoom di una immagine serve appunto per poter caricare nella pagina immagini piccole e poi caricare quelle piu grandi solo quando l’utente ci clicca su.con lightbox invece le immagini zoom vengono già caricate nella pagina anche se mostrate con una dimensione ridotta all’utente.
Qundi questa soluzione non mi convince, non tanto per i 100 k di Js quanto piu per il fatto che non gestisca immagini thumbnails e zoom distinte.
21
Ho provato ad inserire più immagini. Ma quando vado in anteprima non mi appaiono i pulsanti nex e prev. Vorrei sapere da che dipende?. Grazie anticipatamente per la risposta
# - postato da rocco - 21 Agosto 2007 - 15:10
22
Salve io ho un problema con la vesrions 2 su IE7.
Praticamente se cambio avevo linkato un immagine e poi a questa ultima cambio le dimensioni, la funzione continua a tenermi in memoria la vecchia. Ho anche scuotato la cache e i file temporanei ma continua a darmi il problema.
Mentre con Firefox è tutto perfetto, si va a prendere l’immagine aggiornata.Sbaglio io qualcosa o è un bug della funzione?
Grazie a tutti per l’attenzione!
# - postato da Vampiretta - 11 Novembre 2007 - 05:19
23
@ Rocco:
hai visto nel file del css dove devi mettere le due immagini di next e prev? Mi pare le voglia in una cartella images. O altrimenti se tieni tutto in una cartella, togli il percorso alla cartella di riferimento che mette lui lasciando solo il nome del file next e prev.Io almeno ho fatto così!
Oh ho visto ora la data del tuo post, probabilmente hai già risolto. Sorry! ^_^
# - postato da Vampiretta - 11 Novembre 2007 - 05:25
24
Salve a tutti!
Ho fatto un piccolo adattamento che mi permetta di avere le gallerie di immagini in lightbox (con tasti prev e next), direttamente richiamate da un filmato flash (come un bottone o un thumb)!
Se vi interessa dateci un’occhiata qua:
flash lightbox v2, troverete il tutorial e l’esempio da scaricare!# - postato da Alan Curtis - 08 Dicembre 2007 - 18:48
25
ciao, come faccio a usare il lightbox su explorer? perche le immagini mi si vedono con firefox ma con explorer no :(
26
Qualcuno vuole essere tanto gentile di dirmi dove posso trovare un manuale molto semplice che mi chiarisca come usare light box 2 ? Ringrazio anticipatanete e saluto tutti.
27
funziona anche su ie6?
28
ciao
qualcuno ha idea di come si faccia ad aggiungere un controllo tipo “commento” o “rating” (di quelli che si trovano su youtube per intenderci) sulla foto che viene visualizzata in lightbox2?
grazie# - postato da maurizio - 24 Luglio 2008 - 14:51
29
Finalmente ho capito cos’è quell’ingrandimento immagini che vedevo in tanti siti! :)
Pensavo fosse fatto il flash…# - postato da Awd - 11 Novembre 2008 - 18:02
30
Perchè su Chrome, Firefox e IExplorer 6 si aprono correttamente le immagini e su IE7 invece mi da un errore javascript???
Tnx
# - postato da Yuri - 22 Gennaio 2009 - 11:31
31
Ciao
al momento ho risolto cambiando script ;)
Con il lightbox 2 le immagini su ie7 si aprivano in una nuova finestra.ho usato questo script:
http://www.no-margin-for-error.....ettyPhoto/Ciao
# - postato da Yuri - 22 Gennaio 2009 - 12:16
32
Al momento io rimango alla versione 1 che però mi da un problema un po’ strano: in una pagina dove ho messo anche la chat di visubox la foto rimane parzialmente coperta dalla chat. Qualcuno sa dirmi il perchè? Grazie a tutti.
33
Problema risolto. Ho inserito nel
function showLightbox(objLink)document.getElementById(’visubox’).style.visibility=’hidden’;
per fare in modo che la chat non coprisse parte della foto ingrandita.
e nel
function hideLightbox()document.getElementById(’visubox’).style.visibility=’visible’;
per fare in modo che quando chiudevo la foto ricomparisse la chat
;)
34
Qualcuno mi può aiutare x favore? Non sono molto esperto. Ho installato lightbox2 nel mio sito ma vorrei poter fare una cosa che cerco di spiegare di seguito:
1) Griglia di diapositive (immagini di varie categorie tipo piante,
animali etc.)2) Con un click, non la foto ingrandita ma una sotto-pagina con altre
diapositive specifiche (Elefante, canguro……….)3) Con un ulteriore click sull’immagine, un’altra pagina con la
descrizione dell’animale ed alcune foto dello stesso.4) Con un click sulla foto, finalmente l’ingrandimento
Avete qualche idea? Temo serva una discreta conoscenza di php ed html! Ringrazio chiunque mi possa gentilmente dare una mano……
# - postato da Enrico - 03 Settembre 2009 - 11:13
35
Ciao a tutti,
ho scaricato e ricreato il lightbox 2.0 con la sequenza di foto che mi interessa e tutto funziona in maniera lineare e senza intoppi…ho un solo piccolo problema che non riesco a risolvere: la prima immagine che apre è l’ultima della serie (la 5 di 5 per intenderci)!
Qualcuno ha idea di come possa fare per avere una sequenza “normale” cioè che inizi dalla 1 di 5?# - postato da Roberto - 03 Gennaio 2010 - 15:48
36
Ciao
ho un problema con un sito in asp, ovvero caricando le immagini quando vado per mettere in funzione il lightbox (cliccando sulle img), il preview mi rimane in attesa senza visualizzare le immagini…
Grazie a voi tutti
Ciao