|
Rank: AiutAmico
Iscritto dal : 12/28/2000 Posts: 40
|
Forse l'oggetto non è molto chiaro, ma spero di farmi capire meglio Sto costruendo un simil "Sito", nel senso che poi andrà solo masterizzato per la distribuzione ad amici e c. Ho una pagina dello stesso che contiene del testo descrittivo e vorrei che alcune parole (5 o 6) se cliccate, o al passaggio del mouse, aprissero un popup, nella stessa pagina, con l'immagine relativa. Che il popup si apra e chiuda in automatico o che si debba chiudere non fa differenza (anche se preferirei l'automatismo!). Es: le annate dal 1950 al 1955 sono contenute in un AlbumVorrei che la parola Album aprisse il popup con l'immagine dell'album. Il modo più semplice è di creare un collegamento all'immagine, apre una nuova pagina e potrebbe anche andare bene se si potesse dimensionare la stessa in modo da non coprire la pagina in primo piano. In rete ho trovato molti esempi ma non sono riuscito (per mia ignoranza ) ad adattarle alle mie necessità. Il sito è strutturato così: C:/Collezioni/Paese/pagina html + con tutte le immagini relative. Per fare tutto questo ho usato JAlbum per le gallerie di immagini e Kompozer per la costruzione delle pagine. Ci stà in html o sposto in Script? Grazie. Luigi
|
|
|
|
|
Rank: AiutAmico
Iscritto dal : 5/4/2003 Posts: 2,845
|
http://www.dynamicdrive.com/dynamicindex4/thumbnail.htmvedi se ti va bene ....si può anche personalizzare in qualche dettaglio.
|
|
Rank: AiutAmico
Iscritto dal : 12/28/2000 Posts: 40
|
a parte l'inglese ho bisogno di qualcosa di più semplice, oppure (e qui salta fuori la mia ignoranza su css e c.) di più spegazioni su come "usare" il progetto Per esempio: dova va inserita la parola Album che deve fare da generatrice dell'apertura del popup? per utilizzare più immagini basta duplicare: <p><a href="http://img184.imageshack.us/img184/1159/castleyi6.gif" rel="thumbnail" title="This is beautiful castle for sale!">Castle</a></p> Castle va sostituito con Album? o va modificato anche altro? se l'immagine è su disco C:/Collezioni/Paese/immagine.jpg come va modificato "http://img184 ecc.ecc? "../Collezione/Paese/immagine.jpg....va bene?? Ancora grazie. Ciao
|
|
Rank: AiutAmico
Iscritto dal : 5/4/2003 Posts: 2,845
|
E' molto semplice: scarica i tre files: thumbnailviewer.css thumbnailviewer.js loading.gif e mettili nella cartella principale del progetto. Copia e incolla questo codice: Code:<link rel="stylesheet" href="thumbnailviewer.css" type="text/css" /> <script src="thumbnailviewer.js" type="text/javascript"> /*********************************************** * Image Thumbnail Viewer Script- © Dynamic Drive (www.dynamicdrive.com) * This notice must stay intact for legal use. * Visit http://www.dynamicdrive.com/ for full source code ***********************************************/ </script> tra i tag <head> e </head> del codice html della tua pagina. L'effetto popup si ottiene richiamando lo script col link da testo o da immagine. Da testo: <p><a href="C:/Collezioni/paese/album1.jpg" rel="thumbnail" title="Album 1950">Album 1950</a></p> Da immagine: <p><a href="C:/Collezioni/paese/castello_grande.jpg" rel="thumbnail" title="cast...."><img src="C:/Collezioni/paese/castello_ridotto_o_ridimensionato_con_width_e_height.jpg" /></a></p>
|
|
Rank: AiutAmico
Iscritto dal : 12/28/2000 Posts: 40
|
Chiarissimo lui49, ho fatto dei passi in avanti, ma non non sono definitivi Ho messo tutti i file css, js e le immagini che interessano nella stessa cartella come logica richiede, ho inserito il codice in <head></head> e la parte: <p><a href="C:/Collezioni/paese/album1.jpg" rel="thumbnail" title="Album 1950">Album 1950</a></p> nel punto del testo dove deve comparire la parola da linkare. Ho modificato il codice in: <a href="C:/Collezioni/Liechtenstein/ Album.jpg" rel="thumbnail" title=" Album"> Album</a> dove Album.jpg è l'immagine da visualizzare e Album è la parola che dovrebbe attivare l'aperture del popup. La parola chiave Album diventa blu per segbnalare il link, ma quando ci clicco sopra si apre si il popup (un riquadro nero con la scritta CLOSE e relativa X di chiusura), ma all'interno compare la scritta Album e non l'immagine. Ho modificato la scritta in Album.jpg, ma non cambia niente nel popup compare Album.jpg Può essere colpa della dimensione dell'immagine? (227x400 pixel 13kb) Nel css non ho visto niente che faccia riferimento alla grandezza del popup!! Il js è un po più complicato e mi guardo bene di metterci le mani prima di avere un'indirizzo preciso Eppure è tutto nella stessa cartella!!! È pure facile da usare perchè basta duplicare il codice :p><a href="C:/Collezioni/paese/album1.jpg" rel="thumbnail" title="Album 1950">Album 1950</a></p> posso linkare tutte le parole che mi servono Cosa tralascio? Grazie. Ciao La struttura delle cartelle è C:/Collezioni/Liechtenstein/Liechtenstein.html + tutti i file
|
|
Rank: AiutAmico
Iscritto dal : 5/4/2003 Posts: 2,845
|
Commenta: Ho messo tutti i file css, js e le immagini che interessano nella stessa cartella come logica richiede,.......
<a href=" C:/Collezioni/Liechtenstein/Album.jpg" rel="thumbnail" title="Album">Album</a> ora il file "album.jpg" dove si trova? controlla l'esatto percorso. O mostra la struttura (cartelle) del progetto....
|
|
Rank: AiutAmico
Iscritto dal : 12/28/2000 Posts: 40
|
È tutto dentro la cartella Liechtenstein: la pagina html, le immagini che servono (compresa Album.jpg), i file css, js, tutto ciò che compone la pagina Liechtenstein. Il tutto è dentro la cartella Collezioni in C:/ Per struttura intendi questo: http://img405.imageshack.us/img405/3209/immaginestruttura.pngo la pagina html? questo è il pezzo di codice che ho inserito nella pagina: <p><a href="C:/Collezioni/Liechtenstein/Album.jpg" rel="thumbnail" title="Album.jpg">Album</a></p> Bolaffi "Milord" Ciao
|
|
Rank: AiutAmico
Iscritto dal : 5/4/2003 Posts: 2,845
|
prova a modificare
href="C:/Collezioni/Liechtenstein/Album.jpg"
in
href="Album.jpg"
|
|
Rank: AiutAmico
Iscritto dal : 12/28/2000 Posts: 40
|
|
|
Rank: AiutAmico
Iscritto dal : 5/4/2003 Posts: 2,845
|
Bene.... ora vado a dormire. Domani, se vuoi, ti dico come apportare delle piccole modifiche alle immagini popup (anche se non è un popup) Ciao Luigi
|
|
Rank: AiutAmico
Iscritto dal : 12/28/2000 Posts: 40
|
lui49 ha scritto:Bene.... ora vado a dormire. Domani, se vuoi, ti dico come apportare delle piccole modifiche alle immagini popup (anche se non è un popup) Ciao Luigi in effetti è più una pagina ridotta!!! grazie, aspetto con ansia Buonanotte
|
|
Rank: AiutAmico
Iscritto dal : 5/4/2003 Posts: 2,845
|
Nel css il dimensionamento delle immagini è lasciato su "auto", anche perchè non avrebbe senso forzare il sovradimensionamento di una immagine piccola guastandone la definizione. Per avere un buon risultato bisogna quindi disporre di immagini relativamente grandi. Io, per esempio, uso immagini da 640x480 (per le orizzontali) e 360x480 (per le verticali).
:
p><a href="C:/Collezioni/Liechtenstein/Album.jpg" rel="thumbnail" title="Album.jpg">Album</a></p>
quello che scrivi nel tag "title" compare poi in calce al popup. Se vuoi ridimensionare il carattere e altro lo devi fare variando i parametri del ID "#thumbBox .footerbar" del file "thumbnailviewer.css". Se non scrivi nulla, tipo (title="") in calce non compare nulla. Il popup si chiude cliccando su qualsiasi punto dello stesso; quindi se vuoi eliminare "close X" o modificarla in "chiudi" o altro devi editare la riga "definefooter: '<div class="footerbar">CLOSE X</div>', //Define HTML for footer interface" del file "thumbnailviewer.js" cancelllando o modificando la voce in rosso. Se vuoi l'apertura del popup senza animazione, da impostare secondo me, devi modificare, sempre nello stesso file il valore in rosso "enableAnimation: true, //Enable fading animation?" da true in false
|
|
Rank: AiutAmico
Iscritto dal : 12/28/2000 Posts: 40
|
lui49 ha scritto:Nel css il dimensionamento delle immagini è lasciato su "auto", anche perchè non avrebbe senso forzare il sovradimensionamento di una immagine piccola guastandone la definizione. Per avere un buon risultato bisogna quindi disporre di immagini relativamente grandi. Io, per esempio, uso immagini da 640x480 (per le orizzontali) e 360x480 (per le verticali). io le avevo ridotte tutte pensando di fare bene!!!! lui49 ha scritto:
p><a href="C:/Collezioni/Liechtenstein/Album.jpg" rel="thumbnail" title="Album.jpg">Album</a></p>
quello che scrivi nel tag "title" compare poi in calce al popup. Se vuoi ridimensionare il carattere e altro lo devi fare variando i parametri del ID "#thumbBox .footerbar" del file "thumbnailviewer.css". Se non scrivi nulla, tipo (title="") in calce non compare nulla. Il popup si chiude cliccando su qualsiasi punto dello stesso; quindi se vuoi eliminare "close X" o modificarla in "chiudi" o altro devi editare la riga "definefooter: '<div class="footerbar">CLOSE X</div>', //Define HTML for footer interface" del file "thumbnailviewer.js" cancelllando o modificando la voce in rosso. Se vuoi l'apertura del popup senza animazione, da impostare secondo me, devi modificare, sempre nello stesso file il valore in rosso "enableAnimation: true, //Enable fading animation?" da true in false
applicato tutto e mi piace moooolto di più Ho anche cambiato colore alla cornice perchè il nero faceva tanto luttuoso!!!!!! Mi allargo: applicare apertura e chiusura al passaggio del mouse sarebbe complicato? o questo sarebbe proprio la differenza tra popup e il nostro caso? Comunque questa soluzione mi piace e ora mi faccio una bella cartella con tutti i file e istruzioni varie per il futuro!!!! Ciao omonimo
|
|
Rank: AiutAmico
Iscritto dal : 5/4/2003 Posts: 2,845
|
tu vorresti un effetto come questo però, come vedi dalla demo, il popup segue il puntatore lungo il link (e deve essere piccolo perchè se lo copre l'effetto "onmouseover" cessa e diventa "onmouseout" chiudendo il popup) e se questo si trova ai margini della pagina l'immagine può risultare mezza o tutta fuori dalla schermata.
|
|
Rank: AiutAmico
Iscritto dal : 12/28/2000 Posts: 40
|
lui49 ha scritto:tu vorresti un effetto come questo però, come vedi dalla demo, il popup segue il puntatore lungo il link (e deve essere piccolo perchè se lo copre l'effetto "onmouseover" cessa e diventa "onmouseout" chiudendo il popup) e se questo si trova ai margini della pagina l'immagine può risultare mezza o tutta fuori dalla schermata. Ciao lui49, bello l'effetto, ma come dici tu forse non posso usarlo in questo caso, alcune immagini sono grandi e alla destra della pagina quindi, uscirebbero dalla stessa. Comunque me lo sono segnato....non si sa mai Il lavoro però l'ho finito e se vai qui puoi vedere il risultato: http://exfrancobolliluis.altervista.org/Collezioni%20in%20vendita.html(Manca ancora il resto del progetto, quindi dalla home si vede solo il Liechtenstein .) Ti ringrazio tanto per il prezioso aiuto che mi hai dato e ti auguro Buone Feste Luigi
|
|
Rank: AiutAmico
Iscritto dal : 5/4/2003 Posts: 2,845
|
Bene....un pò ne colleziono anch'io.
Io uso, come moltissimi, la risoluzione dello schermo 1280x800. Il dimensionamento della due tabelle rispettivamente a 1423 e 1416 fà uscire dallo schermo la pagina costringendo a spostarsi con la barra per visualizzarla tutta. Prova impostando entrambe a 1270px. Attenzione: nella pagina "liechtestein.html" i riferimenti (il famoso popup) devono essere rigorosi perchè basta che una sola immagine non venga caricata perchè, pur senza messaggio di errore del titpo "file non trovato", si sballi la posizione "absolute" di apertura delle immagini stesse che diventerebbe casuale, fuori centro, fuori quadro.
|
|
Rank: AiutAmico
Iscritto dal : 12/28/2000 Posts: 40
|
lui49 ha scritto:Bene....un pò ne colleziono anch'io. io invece sono arrivato a cercare di disfarmene perchè in famiglia non ho nessuno a cui interessi continuare lui49 ha scritto: Io uso, come moltissimi, la risoluzione dello schermo 1280x800. Il dimensionamento della due tabelle rispettivamente a 1423 e 1416 fà uscire dallo schermo la pagina costringendo a spostarsi con la barra per visualizzarla tutta. Prova impostando entrambe a 1270px. Attenzione: nella pagina "liechtestein.html" i riferimenti (il famoso popup) devono essere rigorosi perchè basta che una sola immagine non venga caricata perchè, pur senza messaggio di errore del titpo "file non trovato", si sballi la posizione "absolute" di apertura delle immagini stesse che diventerebbe casuale, fuori centro, fuori quadro.
mi erano scappate un paio di Maiuscole non me n'ero accorto perche da disco funzionava lo stesso Se riesco a capire quanto spazio ho ancora libero su altervista magari ci metto anche il resto !!! Ciao e ancora Buon Natale
|
|
Rank: AiutAmico
Iscritto dal : 12/28/2000 Posts: 40
|
scusami tanto lui, ma ho ancora bisogno di te: ho fatto le modifiche per risolvere le visualizzazioni e ho aggiunto quelle due scritte, ma dopo il trasferimento della pagina non ottengo più l'effetto "popup" di prima L' effetto su disco va benissimo, ma dopo iul trasferimebnto non funziona più Ho riletto tutta l ap agina, ma non vedo cosa possa bloccare lo script!!! Potresti darmi un'occhiata? Grazie. Luigi
|
|
Rank: AiutAmico
Iscritto dal : 5/4/2003 Posts: 2,845
|
funziona tutto cambia colore alla cornice, magari blu (il verdino è poco serio) riduci le immagini relative alla coppia di albums rossi e della scatola (troppo alte) Prova a rinominare il file "thumbnailviewer.js" e a sostituirlo con questo
|
|
Guest |