Hoe maak je een Flash Rollover Afbeelding

Hoe maak je een Flash Rollover Afbeelding Jupiterimages / Photos.com / Getty Images

Met Flash, is het mogelijk om gekke effecten die overeenkomen met wat andere programma's zoals Javascript staat zijn van het doen van te maken.Rollover beelden kunnen voor effecten op een site, of ze kunnen worden gebruikt als middel om naar andere gedeelten van een dynamische site.ActionScript gebruik maakt van een rollover-effect om meer veelzijdig in aanvulling op ervoor te zorgen dat de animatie kleine blijft zijn.Slechts een paar regels van het script nodig zijn om een ​​voorwerp van staat A naar B naar C.

wat je nodig hebt

  • Afbeeldingen & lt; br / & gt; Flash CS3 applicatie

instructies

  1. Open een nieuwe ActionScript 3.0 Flash-bestand.

  2. Importeer uw afbeeldingen.Dit wordt gedaan door te gaan naar het menu \ "Bestand, \" \ "Importeren \" en \ "Importeren naar bibliotheek. \"

  3. Selecteer de tijdlijn en noem "Layer 1" tot "Afbeelding 1"

  4. Sleep een afbeelding uit de bibliotheek op het podium.

  5. Zet het beeld in een symbool.Dit wordt gedaan door op F8 te drukken of ga naar het menu \ "Insert \" en \ "Nieuw symbool. \"

  6. Naam het symbool "Afbeelding 1" en laat "filmclips" om te zetten in een filmclip.

  7. Klik op \ "OK. \" Een filmclip met de naam "Afbeelding 1" verschijnt in de bibliotheek.

  8. Geef de filmclip een instantie naam "Image1_mc. \" Doe dit onder het paneel "Eigenschappen" onder het podium te vinden onder het tabblad "Eigenschappen".

  9. Selecteer de 30e frame op de tijdlijn en druk op F5 omeen kader toevoegen.

  10. Maak animatie door ergens tussen het frame 1 en 30 en het selecteren van de rechtermuisknop te klikken op "Create Motion Tween. \"

  11. Select kader 30.

  12. Selecteer het beeld op het podium en verander de Alphainstelling op 0 procent door naar de tab "Eigenschappen" onder "Color." Het beeld op het podium is nu onzichtbaar.

  13. Lock de "Afbeelding 1" laag en voeg een nieuwe laag "Afbeelding 2." Gebruik de "Lock / Unlock Alle lagen" icoon boven de lagen.

  14. Select kader 55 van de "Afbeelding 2" laag en druk op F5.

  15. Select kader 25 en druk op F6.Dit voegt een key frame op het geselecteerde frame.

  16. Drag "Afbeelding 2" op het podium en druk op F8.

  17. Kies \ "Movie clip \" en geef het de instantienaam "Image2_mc. \"

  18. Maak een bewegings-tween tussen het frame 25 en 55.

  19. Select kader 25 en het beeld op het podium enverander de Alpha-instelling op 0 procent.

  20. Select kader 30 en het beeld op het podium en geef het een Alpha-instelling van 100 procent.

  21. Select kader 55 en het beeld op het podium en stel de Alpha-instelling op 0 procent.

  22. Herhaal de bovenstaande stappen voor meer foto's toegevoegd. Plaats een nieuwe laag genaamd "Actions" en druk op F6 op het frame 30 en 55 tot en met keyframes toe te voegen.

  23. Klik op het frame 1 van de 'Acties' laag enDruk op F9 om de volgende code toe te voegen:; br / & gt; & lt stoppen () & lt; br / & gt; GO & lt; br />image1_mc.addEventListener(MouseEvent.MOUSE_OVER,imageOver)<br / & gt; GO & lt; br / & gt; functie imageOver (event: MouseEvent): void {& lt; br / & gt; spelen () & lt; br / & gt; GO & lt; br / & gt;}

  24. Select kader 30 van de "acties" laag en voer de codehieronder: & lt; br / & gt; stop () & lt; br / & gt; GO & lt; br />image2_mc.addEventListener(MouseEvent.MOUSE_OVER,imageOver2)<br / & gt; GO & lt; br / & gt; functie imageOver2 (event:MouseEvent): void {& lt; br / & gt; spelen () & lt; br / & gt; GO & lt; br / & gt;} & lt; br / & gt; & lt; br / & gt; Select kader 55 en onder de laag Actions plaatst deze lijncode: & lt; br / & gt; Stop ();". Ctrl + Enter"

  25. Test de film door te drukken Je afbeelding rollover-effect zou nu moeten werken. & Lt; br / & gt; publiceren de animatie door te gaan naar \ "File \" en \

"Publiceren \."

Tips & amp;Waarschuwingen

  • U kunt zoveel objecten mogelijk te glijden in en uit te hebben.& lt; br / & gt; & lt; br / & gt; Met afbeeldingen, tekst invoeren en knoppen ingebed in de filmclip symbool om dynamische animaties te maken.

Resources

  • Script Playground: Dynamic Image Rollovers Met behulp van klassen
198
0
1
Animatie Software