Nota: in questa lezione si fa uso del filtro Alien Skin Splat LE che
non è presente in Fireworks 4, ma il mancato utilizzo di questa caratteristica
non compromette il funzionamento dell'effetto e quindi può essere saltato.
I pulsanti di navigazione principale, oltre ad avere un rollover che fa cambiare
colore al testo, presentano anche un altro effetto noto con il nome di rollover
disgiunto: quando il puntatore del mouse passa sopra di essi nella parte
superiore della barra compare un'immagine diversa per ogni pulsante.
Lavoriamo ancora con il file interfaccia.png. Apriamo il pannello Livelli,
creiamo un nuovo livello (Livello2) e blocchiamo il Livello1.
Nel nuovo livello disegniamo un rettangolo 240x70 senza bordi, con un riempimento
qualsiasi e posizioniamolo in X = 440, Y = 2.
Apriamo il pannello fotogrammi e dal menu Opzioni (attivabile cliccando
sul pulsante indicato dalla freccia rossa) scegliamo Duplica fotogramma impostando
5 fotogrammi e selezionando l'opzione Dopo il fotogramma corrente.
Selezioniamo il fotogramma 2, cancelliamo il rettangolo sopra
i pulsanti e importiamo l'immagine africa.jpg dalla cartella "originali".
Posizioniamo l'immagine in X = 440, Y = 2 e applichiamole uno
dei filtri messi a disposizione da Fireworks MX: Filtri > Alien Skin Splat
LE > Edges. Nella finestra di dialogo che si apre impostiamo i seguenti parametri:
Edge width = 20.00
Margin = 0.00
Feature size = 40.00
Edge Mode = Halfatone Dots
Color > Definisci colori personalizzati: Rosso = 255, Verde = 204, Blu =
0 (equivalente a #FFCC00).
Niente vieta che proviate altre combinazioni dei parametri (soprattutto
l'Edge Mode) che potrebbero piacervi di più!
Ripetiamo quanto fatto per il fotogramma 2 anche per i quattro
fotogrammi seguenti cambiando, ovviamente, l'immagine da importare; in particolare:
nel fotogramma 3 importiamo america.jpg, nel 4 asia.jpg, nel 5 europa.jpg e
nel 6 oceania.jpg.
Nota: potete cambiare gli effetti da applicare alle varie
immagini nei fotogrammi, l'unica cosa importante è che le foto vengano
posizionate tutte nello stesso punto.
Una volta terminate queste operazioni torniamo al fotogramma 1,
selezioniamo il rettangolo, togliamo il riempimento e scegliamo Modifica >
Inserisci > Porzione.
Modifichiamo leggermente dimensioni e posizione della porzione
portandoli rispettivamente a 240x74 e X = 440, Y = 0. Capiremo nella prossima
lezione il perché di tale modifica.
Siamo adesso alla realizzazione del comportamento da associare
ai pulsanti per ottenere l'effetto voluto. Sblocchiamo il Livello1, selezioniamo
il primo pulsante a sinistra (Africa), clicchiamo sul cerchietto che compare
al centro e, tenendo premuto il tasto del mouse, trasciniamo sulla porzione
che abbiamo inserito in corrispondenza del rettangolo trasparente. Si apre una
piccola finestra di dialogo, dal menu a discesa selezioniamo Fotogramma
2 e confermiamo cliccando su OK.
Ripetiamo quanto fatto anche per gli altri quattro pulsanti scegliendo
ogni volta dal menu a discesa il fotogramma che contiene l'immagine che
vogliamo associare al pulsante.
Testiamo il nostro lavoro con l'ormai consueto F12 e se tutto
funziona salviamo il documento.
