23
Jul

Pagepeel: visualizzarlo correttamente con altre animazioni Flash

1

Eccomi di nuovo a parlare dell’effetto Page Peel. Pensavate fosse finita?
Nemoprincess aveva gia’ introdotto l’argomento, io l’ho integrato con quest’articolo e ora non rimane altro che concludiamo in bellezza.

In questa sede, discuteremo come visualizzare correttamente l’effetto in presenza di un’altra animazione in flash. Infatti, se nella pagina web sono presenti altri .swf oltre allo script Page Peel, quest’ultimo comparira’ sotto le altre animazioni in flash.

Tra i numerosi commenti, si era supposto che il problema fosse causato dalla mancanza dello z-index (proprieta’ presente nei CSS, che controlla quali elementi sono disposti “sopra” o “sotto” rispetto alla profondità dello schermo).
Riflettendoci un po’, ho capito che il problema poteva essere risolto aggiungendo il parametro “wmode” nel secondo file .swf, lasciando stare lo script.

La procedura da seguire e’ molto semplice:

  • Per chi usa DreamWeaver come me, lo script “AC_RunActiveContent.js” verra’ generato ed inserito automaticamente nella pagina web:

  • Stessa cosa per l’animazione in flash:






  • Ora dobbiamo inserire il tag “wmode” col parametro “opaque” all’interno di “AC_FL_RunContent“:

... ality','high','wmode','opaque','pluginspage','htt ...

  • Fatto? Bene, perche’ poi si deve aggiungere, sotto agli altri parametri gia’ presenti:


Esempio:
......

  • Ed infine aggiungere in EMBED:

... wmode="opaque" ...

  • Ecco il codice modificato completamente:






Salviamo tutto, carichiamo i file nel server ftp e godiamoci l’effetto fixato.

Web Design

22
Jul

Plugin Firefox per l'ftp

3

FireFTP e’ un’ estensione per Firefox capace di sostituire in toto qualsiasi altro client ftp, persino Filezilla a mio parere.
La versione 1.0.5 si installa su Firefox 3.5.x, mentre, per chi usa precedenti versioni del browser, esiste un archivio dedicato. Come se non bastasse, e’ completamente compatibile con Windows, Mac OSX e Linux.

Ecco la finestra principale:

fireftp0

Dotato di un’interfaccia semplice e molto intuitiva, e’ possibile configurare velocemente i parametri d’accesso a qualsiasi tipo di server ftp.

fireftp3

Dico qualsiasi perche’ il plugin include anche i vari protocolli di sicurezza:

fireftp1

Inoltre, aprendo il menu’ “Tool” posto in alto a destra, tramite i pulsanti Import ed Export, si potra’ salvare ed importare in un unico file tutti gli account creati con i relativi parametri di connessione.

fireftp4

Sara’ possibile abilitare il filtro cerca tramite selezione di Search/Filter (visibile a pie’ pagina), per trovare file e cartelle sia in locale che in remoto:

fireftp5

Le altre funzioni interessanti che segnalo sono:

  • Drag & Drop dei file da trasferire
  • Esportazione/Importazione degli account
  • Riconnessione automatica e funzione di Resuming

N.B.: non preoccupatevi, il plugin e’ completamente in italiano.

fireftp_firefox_plugin

Plugin

17
Jul

Prism: applicazioni web sul desktop

1

Un mio caro amico, settimane fa, mi ha fatto conoscere questo nuovo programma di Mozilla Labs: Prism.

L’utilità di questa nuova applicazione (ancora in fase beta), sta nel fatto che e’ possibile lanciare dal proprio desktop tutte le nostre applicazioni web preferite che, fino ad ora, erano raggiungibili solamente via browser.

Incuriositi? Bene! Scarichiamo il file compresso (scegliendo la versione STANDALONE APPLICATION) e scompattiamo.
All’interno della cartella “prism” troveremo una serie di cartelle e il file “prism.exe“. Una volta eseguito, la finestrella che ci comparirà sarà simile a questa:

01

Con i seguenti campi da impostare:

  • URL: si dovra’ inserire il link che vogliamo trasformare in applicazione;
  • Name: il nome che vogliamo associarvi;

E la scelta di varie opzioni tramite check button.
Consiglio: spuntare almeno Desktop nella sezione Create Shortcut

Diamo l’ok e, se tutto e’ andato per il verso giusto, dovrebbe comparire nel desktop l’icona relativa dell’applicazione. Per esemplificare, ho scelto il form di login di Libero.it

02

Ora non resta altro che cliccare sull’icone e… Ecco qui il risultato! Comodo, non e’ vero??

Clicca per ingrandire

Ma l’utilita’ di tutto questo dove risiede? Semplicemente Prism permette di avviare tutte le applicazioni che desideriamo senza il rischio che terminino improvvisamente. Pensiamo ad esempio a Firefox (unico processo) con molte tab aperte. Se Firefox crasha, perdiamo tutte le applicazioni aperte fino a quell’istante… Con Prism cio’ non avviene, perche’ ogni appz viene gestita su processi separati.

P.S.: momentaneamente Prism e’ disponibile solo in lingua inglese per Pc e Mac (ricordo che e’ ancora in beta test), e credo che ne sentiremo parlare sempre piu’ spesso.

prism_1

Allora avete provato? Cosa ne pensate? Futuro concorrente di Adobe Air?

Open Source, Software

16
Jul

Effetto Page Peel bloccato da AdBlock Plus: come risolvere

0

AdivorPeel, il famoso script gratuito che permette di arricciare l’angolo superiore di una pagina web, e’ veramente uno strumento utile e molto valido. Lo script, come ormai molti di voi sapranno, è scaricabile gratuitamente da Avidorblog.com oppure in alternativa dal mirror postato da nemoprincess in questa pagina.

In questo periodo, ho testato molti script simili e, a mio parere, AdivorPeel -grazie alla fluidità data dall’animazione in Flash- rimane il più semplice ed elegante effetto “page peel” della categoria.

Utilizzando Mozilla Firefox, ho riscontrato un “problemino tecnico” causato dall’estensione Adblock Plus. L’estensione, essendo molto invasiva, filtra la maggior parte di banner e testi pubblicitari. Purtroppo blocca perfino il nostro scriptino.

Una soluzione banale sarebbe disabilitare l’estensione incriminata, ma non la ritengo valida a causa dell’enorme quantita’ di banner e pubblicita’ che imperversa nel web e che, sinceramente, mal digerisco. Quindi, come ho risolto il problema?

Navigando per la rete ho trovato uno script molto simile (d’ora in poi chiameremo jaaspeel) che utilizza la medesima animazione di AdivorPeel, mentre il codice nel file .js e’ leggermente diverso.

Scarichiamo da questo mirror il pacchetto contenente la cartella “peel” con seguenti file:

  • large.swf
  • large.jpg
  • small.swf
  • small.jpg
  • peel.js

Ora non ci resta che editare il file “peel.js” modificando i seguenti campi con i nostri dati:

  1. jaaspeel.ad_url – URL della nostra pagina pubblicitaria
  2. jaaspeel.small_path – percorso del file small.swf
  3. jaaspeel.small_image – percorso del file small.jpg
  4. jaaspeel.big_path – percorso del file large.swf
  5. jaaspeel.big_image – percorso del file large.jpg

ad esempio:

  1. jaaspeel.ad_url = escape(‘http://www.miosito.com’);
  2. jaaspeel.small_path = ‘http://www.miosito.com/peel/small.swf’;
  3. jaaspeel.small_image = escape(‘http://www.miosito.com/peel/small.jpg’);
  4. jaaspeel.big_path = ‘http://www.miosito.com/peel/large.swf’;
  5. jaaspeel.big_image = escape(‘http://www.miosito.com/peel/large.jpg’);

Una volta modificato il file, editato le immagini ed inserito il seguentecodice javascript:

Web Design