Thumbox dentro iframe

[Aekold]

salve a tutti, ho un problema che sono settimane che non riesco a risolvere.

Ho creato il mio sito, tutto bello e pronto, e grossomodo consiste in una pagina "scheletro" madre, in cui vi è un bell'iframe in cui aprire pagine secondarie.

in una di queste sezioni da visualizzare all'interno dell'iframe, e precisamente la sezione "Media", devono starci solamente 2 cose: il player video embed che già ci sta dentro, e con quello nessun problema, ed una galleria di fotografie.

Ed è proprio quest'ultima il problema. La mia intenzione era di inserire una galleria con Thumbox (che ho trovato proprio su html.it -->http://javascript.html.it/script/ved...e-di-immagini/). Bene o male estrapolo il codice, tento di inserirlo nella pagina che va aperta nell'iframe, ma come risultato ottengo che le foto mi si aprano anch'esse all'interno dell'iframe (e per di più anche nascoste dal player video).

La mia domanda è. "Esattamente", in che modo dovrei inserire il codice affinchè le foto con il thumbox mi si aprano, non all'interno dell'iframe dove sono inseriti i thumbnails, bensì nella pagina principale?

Forse sono poco chiaro.. dunque.. questo è il mio bel sito:
http://effepicreations.altervista.or...kness/Main.htm

nel codice della pagina principale, cioè main.htm, ho fatto in modo che, cliccando sulle sezioni, esse vengano visualizzate all'interno di un iframe di larghezza circa 500.
In particolare, nella sezione "Media" ho esigenza di inserire una galleria fotografica. Dato il limitato spazio a disposizione per la visualizzazione delle stesse foto, ho pensato che l'unica opzione fosse inserire una visualizzazione in stile Thumbox (o lightbox, o shadowbox.. ne ho trovati a milioni cercando di risolvere il problema.. ma proprio non mi riesce). Solo che non riesco a capire come fare ad aprire le immagini visualizzandole sulla pagina principale anzichè all'interno dell'iframe.

grazie in anticipo.

[br1]

Un iframe non e' null'altro che una finestra ospitata all'interno di un'altra finestra che allo scopo le riserva un proprio spazio.
E come accade per tutte le finestre il contenuto di una non puo' invadere lo spazio riservato ad un altra ( e gli ingrandimenti delle foto sono generati e appartenenti all'iframe, quindi.... )

[Aekold]

si, so cos'è un iframe, ma è anche vero che ho trovato in rete qualcosa di molto confusionario su un certo tag _parent, che scritto da qualche parte dovrebbe servire al mio scopo.. solo che non ho completamente idea di come usarloXD

grazie per la risposta cmq eventualmente accetto anche suggerimenti su metodi "alternativi" di pubblicare una galleria fotografica:P

[Reiko81]

Originariamente inviato da br1
Un iframe non e' null'altro che una finestra ospitata all'interno di un'altra finestra che allo scopo le riserva un proprio spazio.
E come accade per tutte le finestre il contenuto di una non puo' invadere lo spazio riservato ad un altra ( e gli ingrandimenti delle foto sono generati e appartenenti all'iframe, quindi.... )

E' la stessa cosa che sto cercando anch'io... e anch'io ho letto, senza capire, del _parent.
Per caso hai trovatola soluzione?

[Aekold]

Originariamente inviato da Reiko81
E' la stessa cosa che sto cercando anch'io... e anch'io ho letto, senza capire, del _parent.
Per caso hai trovatola soluzione?

una soluzione l'ho trovata.. ho usato il lytebox (http://www.dolem.com/lytebox/)

all'interno del sito stesso è spiegato bene come usare la versione per gli iframe..

non mi pare di aver agito sul codice stesso, la versione per gli iframe è già ottimizzata.. devi solo avere cura di inserire i file immagine nel percorso giusto

diciamo che su questo sito mi ha funzionato

http://www.guruofdarkness.com

la galleria sta nella sezione "media"

prova a vedere se ti riesce.. altrimenti posto il codice che ho inserito io

[Reiko81]

WOW! Provo subito, grazie per la dritta!!!!

No, niente da fare... dice semplicemente:
iFrames: If you plan to use Lytebox in an iFrame environment, then you need to include lytebox.css in the parent document, while including lytebox.js in the iFrame document.

Ma veramente non riesco a capirlo!

[Aekold]

Originariamente inviato da Reiko81
WOW! Provo subito, grazie per la dritta!!!!

No, niente da fare... dice semplicemente:
iFrames: If you plan to use Lytebox in an iFrame environment, then you need to include lytebox.css in the parent document, while including lytebox.js in the iFrame document.

Ma veramente non riesco a capirlo!

ti spiego meglio.. quando scarichi il pacchetto del lytebox, all'interno ci trovi una cartella di immagini, un file chiamato lytebox.css, e un file chiamato lytebox.js, che rispettivamente sono il foglio di stile relativo al lytebox e il codice javascript sempre relativo allo stesso..

Le istruzioni che ti da significano che devi inserire il comando relativo al richiamo del css nel documento parent, cioè letteralmente, nel documento "genitore", ossia quello che racchiude l'iframe, nel consueto modo in cui dai il richiamo agli altri fogli di stile, dando l'istruzione nella sezione "head" del codice sorgente della pagina. Mentre il comando per il javascript devi darlo nel codice sorgente della pagina in cui hai la galleria che vorresti fosse visualizzata tramite lytebox..

Ad esempio, se hai una pagina chiamata "index.html", all'interno della quale si trova un iframe in cui viene visualizzata la pagina, ad esempio chiamata "gallery.html", nel codice sorgente della pagina index.html devi inserire, nella sezione "<head>, il comando "<link rel="stylesheet" href="lytebox.css" type="text/css" media="screen" />, mentre nella sezione "<head>" della pagina che vuoi visualizzare dentro l'iframe, devi inserire il codice <script type="text/javascript" language="javascript" src="lytebox.js"></script>. Inoltre, per ogni immagine su cui vuoi utilizzare il lytebox, devi usare, anzichè il semplice tag [img]nomefile[/img], il tag Image #1, dove al posto di " Image #1 " puoi inserire un thumbnail dell'immagine che vuoi visualizzare col lytebox, o una semplice scritta su cui cliccando, effettuerai l'apertura dell'immagine con lytebox. Se poi vuoi usare, anzichè un semplice effetto lytebox, un effetto lytebox che includa uno slideshow, o comunque collegare le immagini tra di loro formando una galleria, usa, al posto di sto ultimo codice, il codice corrispondente che trovi elencato nella stessa pagina http://www.dolem.com/lytebox/.

Ovviamente ricordati di controllare di aver inserito il percorso esatto per ogni file che usi.

Ad esempio, personalmente, per questioni di ordine, sono solito dividere tutto ciò che riguarda un sito, in un insieme di cartelle. Avrò la pagina principale, chiamata "index.html" o "index.htm", una cartella chiamata "css", dove inserisco tutti i css usati all'interno di tutto il sito, una cartella chiamata "js", dove inserirò tutti i file javascript usati nel sito, ed una cartella "img", dove inserirò tutte le immagini usate nel sito. Se poi il sito è costituito, come nel caso di un sito con iframe, da più di una pagina, avrò una ulteriore cartella che chiamo di solito "sub", dove inserirò le pagine secondarie, fermo restando che le immagini, i css e i javascript li inserisco tutti nella stessa cartella apposita, siano per la pagina principale o per le subordinate.

Adottando questo ordine anche tu, ad esempio, abbi cura di selezionare bene i percorsi delle cose che vai ad usare.. per quanto riguarderebbe in questo caso l'uso del lytebox, quando vai a richiamare il file css dalla sezione head della pagina principale, il percorso da indicare non è + "lytebox.css", bensì "css/lytebox.css", tenendo conto del fatto che index.html e la cartella css si trovano all'interno della stessa directory, mentre quando vai a richiamare il javascript per il lytebox dall'head del documento subordinato, il percorso non sarà "lytebox.js", ma bensì "../js/lytebox.js", ossia devo indicare il percorso specificando che il file da richiamare si trova non nella stessa directory della pagina subordinata, ma nella cartella "js", situata nella directory "parent", cioè nella directory che racchiude la cartella all'interno della quale si trova la pagina sul cui codice sto lavorando (motivo per cui inserisco la parte "../" nel percorso).. spero di essere stato abbastanza chiaro.. allo stesso modo per il percorso delle immagini inserite nelle pagine subordinate, il percorso da inserire sarà "../img/nomefile"..

Spero di essere riuscito a farmi capire