Fw

Wordpress Creative Developer

Flash e Thickbox Tutorial: Un Post Dal Passato

  • Flash
  • -

Oggi ti propongo uno dei primi articoli comparsi su questo blog, che ha avuto maggiore successo e se è da solo pochi giorni che segui questo blog potrai rileggertelo e magari sfruttarlo per qualche tuo progetto. Buona lettura!

Molti di voi conosceranno lo script lightbox, che permette di aprire le immagini con degli effetti speciali. Però appunto solo immagini. Alan Curtis e juliusdesign hanno proposto delle soluzioni per far interagire i filmati flash con lightbox, però avendo sempre la limitazione sopra citata.

Flash e thickbox

Lo script thickbox, invece permette di aprire non solo immagini, ma iframe, pagine all’interno della stessa finestra in cui si naviga ecc. E allora con poche modifiche sono riuscito ad adattare thickbox ai filmati flash.

In particolare, in questo articolo, spiego come poter aprire un altra pagina (che conterrà qualsiasi cosa vogliate), all’interno della finestra thickbox.

Per prima cosa associate al pulsante flash il seguente codice:

on (release) {
getURL("javascript:tb_show('gallery','gallery.html?KeepThis=true&TB_iframe=true&height=600&width=810')");
}

Nella funzione tb_show impostate il titolo della finestra (‘gallery’), e la pagina che dovrà essere aperta, specificando le dimensioni in altezza e larghezza della finestra.

Nella pagina HTML che contiene il filmato flash dovrete inserire, tra i tag <head> e </head> queste tre righe di codice che “installano” lo script:

<script type="text/javascript" src="script/jquery.js"></script>
<script type="text/javascript" src="script/thickbox.js"></script>
<link rel="stylesheet" href="script/thickbox.css" type="text/css" media="screen" />

Infine, nel tag object, che vi servirà per inserire il filmato swf dovrete inserire fra le altre, queste righe di codice:

<param name="allowScriptAccess" value="sameDomain" />

E nel tag embed

allowScriptAccess="sameDomain"

Guarda la demo

Scarica il sorgente AS2

Scarica il sorgente AS3

Vedi anche Flash e lightview

27 Commenti

  1. Ricorda di caricare in remoto anche l’icona per il preloading “loadingAnimation.gif”

  2. Si grazie…me la sono scordata…

  3. […] aprire un iframe utilizzando anche flash con codice ActionScript in questo […]

  4. Perfetto! Era da tempo che aspettavo un js con queste caratteristiche…

  5. Ciao Federico. Sono una sviluppatrice di siti web e tempo fa ho avuto l’esigenza di integrare flash con lightwindow, per la sua gestione delle gallerie di immagini decisamente ben strutturata.
    In quella situazione, ho sviluppato il tutto interamente in flash…se per te dovesse essere fattibile l’interazione tra lightwindow e flash, a mio parere sarebbe molto interessante. Ciao!

  6. – Carlo
    Molto bene, se hai dei dubbi chiedimi pure…

    – Debora
    Si ci lavorerò sopra, mi sembra molto interessante!!

  7. […] sorgenti per flash cs3 Negli articoli che ho scritto tempo fa, riguardanti Flash e thickbox, Flash e lightview e Flash e lightview (Galleria di immagini), ho aggiunto i sorgenti per Flash […]

  8. […] flash e thickbox Ho aggiornato il tutorial riguardante flash e thickbox, aggiungendo il sorgente per action script […]

  9. […] ricordo che nella sezione tutorial, ci sono altri articoli che potrebbero interessarvi, come flash e thickbox, o flash e […]

  10. Ciao Fede…
    sono giorni che sbattevo la testa per trovare una soluzione a questa simbiosi… ed ecco qui il tuo il tuo sito 🙂

    una domanda vorrei farti… ma il flash originale non viene coperto dal background opaco?
    Se no… non c’è un metodo per coprirlo?
    Grazie
    Linda

  11. Ciau Fede
    ho caricato tutto, funziona ma ho il problema che non mi appare la finestrella per chiudere il thickbox… anche se clicco ESC non succede nulla… do cosa può dipendere? ufff 🙁

  12. Ciao Linda, prova a mandarmi il sorgente per e mail così vedo cosa posso fare ok?

  13. Ciao Fede,
    i sorgenti non sono + disponibili?
    Sai dove posso reperirli?

  14. purtroppo il link dei sorgenti rimandano a http://it.altervista.org/

  15. Ciao è scritto nel commento sopra il tuo come scaricare i sorgenti..

  16. ciao!
    ho scaricato la tua demo per AS2 mi succede una cosa strana…
    se vado alla pagina della demo http://fedex05.altervista.org/flash-thickbox.html funziona (a parte il fatto che l’swf rimane in primo piano) invece se apro la pagina html nella cartella della demo scaricata, non funziona nulla..

    ovviamente non funziona nemmeno la pagina che sto provando a integrare con questa nuova funzione….

    qualche suggerimento?

  17. Ciao! In che senso non funziona nulla? Quale problema ti da?

  18. beh che se apro la pagina della demo fatta da te (e scaricata al link in questa pagina) il collegamento non funziona, non si apre la thickbox.. ora, non so che tipo di problema io abbia visto che la demo online fnziona….

  19. Questo sia con Internet Explorer che con Firefox? Se lo provi in locale devi prima permettere di eseguire il filmato flash. Quando premi ad esempio su “Fedeweb” premi su “Impostazioni” e da li devi aggiungere il file swf tra quelli consentiti..

  20. Ciao a tutti,
    qualcuno saprebbe come chiudere l’iframe aperto utilizzando un pulsante in flash che si trova al suo interno?
    Ciao ciao

  21. Ciao markin. Ti posto la soluzione per action script 2. Associa al pulsante questa funzione:

    on (release) {
    getURL(“javascript:self.parent.tb_remove()”);
    }

    Fammi sapere come va!

  22. Ciao,
    avevo postato anche in un’altra sezione sarà da cancellare mi sa…

    funziona alla grande, grazie mille.
    Se non fosse che ormai sono abituato che risolto un problema ne esce un altro, io lo posto non si sa mai 😮 D
    Sto usando la classe local connection

    (http://www.juliusdesign.net/localconnection-interagire-con-2-swf/)

    per far comunicare la finestra aperta con il thickbox ed il sito sottostante, il problema è che dando

    getURL(”javascript:self.parent.tb_remove()”);

    non mi manda più il comando al sito e si chiude…
    stavo provando con un oncomplete dal sender, oppure al lister, in questo caso pongo la domanda opposta:

    come si fa a chiudere il thickbox non da se stesso ma dal sito che lo ha aperto?
    (o chiudere la finestra sovrastante il sito, sempre con getURL(”javascript:….tb_remove()”);)

    Intanto continuo a provarci se qualcuno lo sapesse già ben venga 😮 D
    oppure spero di postarlo io il prima possibile.
    ciao ciao

  23. Ciao! prova a chiedere anche a Julius, visto che stai usando un suo tutorial forse ti saprà aiutare meglio!

    Fammi sapere come va..ciao!

  24. Ciao,
    posterò anche di la allora,
    intanto diciamo che ho dato il comando della local connection al press e nel release ho dato il comando di chiusura del thickbox,dato che per quello che avevo bisogna può andare bene anche così… da buon italiano ci si arrangia 😀
    Spero comunue di risolvere il problema.
    ciao ciao

  25. Hi there! Do you know if they make any plugins to assist with Search Engine Optimization?
    I’m trying to get my blog to rank for some targeted keywords but I’m not seeing very good gains.
    If you know of any please share. Cheers!

Scrivi un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *