| Image Transitions in Flash Mx
Transitions between 2 images gives a very elegant feel in a Website or Presentation. When there are many images and it has to be displayed in a loop, transition plays a very important role by giving a blending effect when the image changes. As the role of transitons is very vital we have covered this current newsletter on creating "Image Transitions in Flash Mx" Click here to download the source (.fla) file. Movie Properties 1. Create a new movie with dimensions of 300px. X 175px. and fps = 31 with white color as Background Color. 2. Save the flash file as 'transition.fla' 3. In Flash choose File > Import to import image1.png 4. Rename the Layer 1 as Image 1 5. Select the Image 1 and choose Insert > Convert to Symbol 6. Convert it into a Movieclip with Top left as a Registration point selected and name it as 'img1' Making the Transition Movie Clip 7. Choose Insert > Layer to Insert the new layer above Image 1 8. Rename the Layer 2 as Transition 9. With the help of Rectangle Tool create a rectangle of width 15px. and height 175px.( You can change the size as per your requirement i.e. width 25px and height 175px) 10. Select the rectangle and choose Insert > Convert to Symbol 11. Convert it into a Movieclip with Top left as a Registration point selected and name it as 'transition' 12. Choose Window > Align 13. Align the transition MovieClip to Left and Top to the stage 14. Select the transition MovieClip Right click on it and Choose Edit In Place 15. Select the rectangle and choose Insert > Convert to Symbol 16. Convert it into a Movieclip with Top left as a Registration point selected and name it as 'white bar' 17. Rename the Layer 1 as white bar 18.Choose Edit > Copy Frames 19. Choose Insert > Layer to Insert the new layer above white bar. Copy white bar Movie Clip and Paste it in new layer 20. Select the newly added layer and Choose Edit > Paste Frames 21. Automatically it will take the layer name as 'white bar'. 22. Choose Window > Info 23. In the Info panel, keeping Top left Registration point selected, set x position = 15 px and y position = 0 px.(if the width is 25 then the x position should be 25 px and y position should be 0px) 24. Repeat the same procedure upto it is not cover the over all stage. for that set the x cordinate respectivley as given below, | No | X- Position | No | X- Position | | 1 | 30 | 10 | 165 | | 2 | 45 | 11 | 180 | | 3 | 60 | 12 | 195 | | 4 | 75 | 13 | 210 | | 5 | 90 | 14 | 225 | | 6 | 105 | 15 | 240 | | 7 | 120 | 16 | 255 | | 8 | 135 | 17 | 270 | | 9 | 150 | 18 | 285 | (if You are taken width = 25 then for no1 X position should be (25+25=50) last value of X position should be 275) 25. Select frame 2 of all layer and choose Insert > Keyframe 26. Select frame 12 of all layer and choose Insert > Keyframe 27. Select keyframe 2 of all layers and in the Properties panel select Tween as 'Motion' and set Easing value as '100' | 
