Share
In questo rapido suggerimento mostrerò come creare un'animazione ad arricciatura molto semplice per una pubblicità d'angolo sul tuo sito web.
Aprire un nuovo file Flash ActionScript 3.0 e modificarne le dimensioni nel pannello Proprietà su 250 x 250 px. Imposta la frequenza dei fotogrammi su 30 fps.
Crea un rettangolo (240 px per 240 px) e posizionalo alle coordinate (10, 0). Seleziona l'angolo in alto a destra e trascinalo tutto finché non vedi il triangolo.
Vai alla tavolozza dei colori e imposta i gradienti esterni su grigio scuro (# A6A6A6). L'arresto del gradiente centrale è più leggero (#EEEEEE). Seleziona lo strumento secchiello e trascinalo sul triangolo tenendo premuto il tasto Maiusc.
Seleziona il triangolo e premi F8. Assegna un nome a questo nuovo filmato "arricciatura" e modifica il punto di registrazione nell'angolo in alto a destra.
Modifica il arricciare oggetto. Copia il triangolo nel nuovo livello (rinominalo in "bcg" per sfondo) e ruotarlo di 180 gradi. Imposta il colore di riempimento su grigio scuro (# 333333). Crea un livello duplicato del livello "bcg" e rinominalo in "maschera".
Vai al decimo fotogramma e crea i fotogrammi chiave in tutti i livelli. Fare clic con il pulsante destro del mouse sui primi fotogrammi chiave e selezionare Crea interpolazione di movimento. Vai al primo frame e seleziona tutti gli oggetti (Ctrl + A). Scegli lo strumento Trasformazione libera (Q) e riducilo con il tasto Maiusc premuto. Sarà lo stato iniziale. Imposta il valore di facilità in tutti i primi fotogrammi chiave a 100.
Crea un nuovo livello e trascinalo tra il BCG e maschera strati. Chiamalo "pulsante". Crea qualsiasi logo o grafica che desideri e convertilo in un pulsante (F8). Dargli un nome di istanza "pulsante". Lascia l'oggetto arricciato.
Fare doppio clic sul pulsante Proprietà layer di maschera livello e impostare il tipo su "Maschera". Imposta il tipo del livello del pulsante su "Mascherato".
Crea un nuovo livello chiamato Azioni. Vai al decimo frame e crea un keyframe. Vai al pannello delle azioni (F9) e digita Stop();. Fai lo stesso nel primo keyframe.
Dare all'oggetto curl sullo stage il nome di un'istanza arricciare. Nel Azioni livello sul fotogramma 1, aprire il pannello delle azioni (F9). Ora vogliamo che l'oggetto curl ascolti quando il mouse si muove. Digitare il seguente codice.
curl.addEventListener (MouseEvent.MOUSE_OVER, forward); curl.addEventListener (MouseEvent.MOUSE_OUT, indietro); funzione forward (e: MouseEvent): void stage.removeEventListener (Event.ENTER_FRAME, backAnim); stage.addEventListener (Event.ENTER_FRAME, fwdAnim); function backward (e: MouseEvent): void stage.removeEventListener (Event.ENTER_FRAME, fwdAnim); stage.addEventListener (Event.ENTER_FRAME, backAnim);
Il fwdAnim () e backAnim () le funzioni dicono di andare al fotogramma successivo / precedente ogni volta che si accede al nuovo fotogramma. Nel nostro caso è 30 volte al secondo. Aggiungi il seguente codice.
function fwdAnim (e: Event): void curl.nextFrame (); function backAnim (e: Event): void curl.prevFrame ();
Aggiungi il listener di pulsanti e crea una semplice funzione di clic.
Accentsconagua
curl.button.addEventListener (MouseEvent.CLICK, clickMe); function clickMe (e: MouseEvent): void var myURL: URLRequest = new URLRequest ("http://www.yourwebsite.com/"); navigateToURL (myURL); Ora possiamo incorporare il file SWF in una pagina Web.
Nella pagina HTML in cui desideri pubblicare il tuo annuncio, incorpora il file SWF in un div con l'identificatore pageCurl.
Allegare le seguenti proprietà all'oggetto pageCurl nel file CSS. Definiscono le dimensioni del supporto dell'oggetto e ne fissano la posizione in alto a destra della pagina.
#pageCurl margin: 0; posizione: fissa; inizio: 0; a destra: 0; a sinistra: auto; larghezza: 250 px; altezza: 250 px;
Questo è tutto! Controlla il risultato scorrendo l'angolo in alto a destra della pagina per rivelare il tuo annuncio. Spero che tu trovi l'uso per questo suggerimento rapido!
