ciao a tutti,
mi sto scervellando su come fare a far funzionare il visualizzatore di foto lightbox, mi potete dare per esempio un codice di esempio??
ciao a tutti,
mi sto scervellando su come fare a far funzionare il visualizzatore di foto lightbox, mi potete dare per esempio un codice di esempio??
semplice:
vai su : http://www.huddletogether.com/projects/lightbox/
scarichi i file:
lightbox.js - the important stuff
lightbox.css - basic style and tricky PNG support
overlay.png - 80% opacity, black tile used to create shadow
loading.gif - mock status bar used in examples above
close.gif - 'X' graphic placed in top-right corner
infili nel <head>
<script type="text/javascript" src="lightbox.js"></script>
<link rel="stylesheet" type="text/css" href="lightbox.css" />
poi metti la thumbnail dentro un tag anchor:
<a href="immagine-grande.jpg" rel="lightbox">
[img]immagine-piccola.jpg[/img]
</a>
Ed il gioco è fatto
I DON'T Double Click!
ti ringrazio.
un altra domandina, ma è possibile invece delle immagini inserire dei testi e delle immagini insieme?? per esempio usarli come un popup qualsiasi?
Ciao a tutti, io vado a modificare il contenuto di src del tag <img> con del codice JavaScript quando passo col mouse su di un link...Originariamente inviato da artorius
<a href="immagine-grande.jpg" rel="lightbox">
[img]immagine-piccola.jpg[/img]
</a>
Fin qui tutto ok.. ma a questo punto il lightbox non deve più puntare alla vecchia immagine, ma alla nuova...
e per far ciò ho pensato di mettere altro codice JavaScript dentro all'attributo href del tag <a>... e sapendo che l'immagine ha name="img1"
Esempio:
<a href="javascript:this.img1.src" rel="lightbox">
[img]immagine-piccola.jpg[/img]
</a>
Il problema è che il lightbox funziona, ma quando passo sul link che cambia immagine (il quale funziona pure lui)...
e poi ri-clicco sull immagine per ri aprirla col light box non carica nulla...ma solo un immagine bianca, come se il javascript dentro href non venisse interpretato o fosse sbagliato...
No, perché lightbox è stato creato SOLO per le immagini, per far quello che dici devi usare un altro script tipo: http://www.moord.it/examples/virtual_htmlOriginariamente inviato da arsmilitaris
un altra domandina, ma è possibile invece delle immagini inserire dei testi e delle immagini insieme?? per esempio usarli come un popup qualsiasi?
No, javascript non funziona così.... devi modificare la funzione JS dove vai a cambiare il tag src della thumbnail, facendogli anche modificare l'href dell'elemento padre.Originariamente inviato da JCoder87
Esempio:
<a href="java-script:this.img1.src" rel="lightbox">
[img]immagine-piccola.jpg[/img]
</a>
I DON'T Double Click!
Ciao...Originariamente inviato da artorius
No, javascript non funziona così.... devi modificare la funzione JS dove vai a cambiare il tag src della thumbnail, facendogli anche modificare l'href dell'elemento padre.
io modifico il tag src della thumbinail quando avviene l'evento "onmouseover" sul link che ti dicevo...
[*]Clicca Qui
Ecco questo codice fa cambiare la foto correttamente...
Essendo però nuovissimo di JavaScript (mi sono letto il libro dell'Apogeo, ma devo approfondire ancora molto l'argomento), non so come gestire la modifica dell'elemento padre:
<a name="linkmin1" rel="lightbox" href="../images/azienda.png">
[img]../images/azienda.png[/img]
</a>
Ho provato con una seconda istruzione dentro a evento onmouseover, che diventava quindi:
onmouseover="document.min1.src='PathName immagine';
document.linkmin1.href='PathName immagine';"
Ma non funziona...
Dici che devo utilizzare una variabile globale per inserire il pathname da dare ai tag src e href?
Grazie dell'aiuto...
Mirko
Risolto tutto dopo una bella googolata con parametri giusti...
Posto lo stesso il codice di esempio, se magari serve a qualcuno:
clicca qui
<script>
document.getElementById('linktochange').href="link nuovo.htm";
</script>
Mirko
ciao,
grazie a tutti per il prezioso aiuto, ecco la pagina come è venuta
http://arsmilitaris.altervista.org/foto.html
un ultima cosa, da firefox non c'è problema, ma da IE alcune immagini vengono fuori con le barre di scorrimento nella parte sottostante dove cè la didacalia e il numero di pagina, come faccio per ovvire al problema??
Permessi di invio
Rispondi quotando