 |
|
|
Flash slideshow with fade transition |
| Written by AnaS | |
|
In this tutorial it will be explained how to realize a flash slideshow with fade transition between images. For attempting this tutorial you need to have basic knowledge of Flash, but no ActionScript is required. The result should be a flash slideshow below: You should have Flash 8 on your computer and Flash Player 8 or later. Prepare 5 images with 300 px x 225 px dimensions. 1. Let's start! Create a new Flash document. Choose Modify >> Document (Ctrl+J) or go to the Properties panel and change dimensions to 310 px x 235 px. 2. Create 5 new layers. Rename the layers from top to bottom text, images1, images2, images3, images4, images5.
4. In the first frame of the images1 layer drag the first image you want in the slideshow. Select it and go to the Properties panel. Set X:5.0, Y:5.0. While the image is still selected choose Modify >> Convert to Symbol (F8). In the Convert to Symbol window that appears choose MovieClip as type and give it a name of image1MC.
6. Go to the frame 20 of the images1 layer and choose Insert >> Timeline >> Keyframe, or right-click >> Insert Keyframe or press F6. Insert again a new keyframe to frame 30, and then to frame 50. 7. Now go back to first frame and select it. Select then the MovieClip that is there and go to the Properties panel and choose Color: Alpha, Alpha Amount: 0%. Repeat the same actions for frame 50.
10. Select again the Rectangle tool (R). Now choose none for Stroke Color and for Fill Color choose #99CCFF and alpha 60%, like in the picture below. Draw a rectangle, click it to select it, go to the Properties panel and set W:300, H:40, X:5, Y:190.
12. Now just test the movie. Hope this flash tutorial helps!
You need to Register in order to download the FLA file.
written by andrew , September 15, 2007
nice one
written by Kevin , September 15, 2007
AWESOME THANK YOU SOOOO MUCH!! So many cheesy windows application websites when all I wanted was a neat small self contained swf! You saved my life!
written by Frans , September 26, 2007
I followed the tutorial and made a simple dynamic Flash movie in Flash8 without showing any errors. I imported the .swf file in my website with Dreamweaver8. Off line things work fine in Dreamweaver. You can see the dynamic Flash movie. I also tested the uploaded version with Dreamweaver ... everything worked fine. But ... when I open Explorer (and Firefox) ... the place where the Flash movie suppose to be is empty ... even not the Flash logo ... nothing. Any Idea?
written by Kanag , September 27, 2007
Excellent tutorial. This is my first flash test and it came out perfect. Thanks
written by Deepak Sakharkar , October 01, 2007
How to do slideshow without tweening on screen, but using Actionscript.
written by Jon , October 04, 2007
Is there a way to dynamically load the images for the above example?
written by Brandon , October 04, 2007
This was a wonder little lesson. Presented me with a solution for my site to display my project partners logos in a nice manner.
written by Tori , October 26, 2007
You taught me more then I learned after visiting half a dozen other dumb uninformative sites so thanks.
written by Antonia , October 31, 2007
Thanks for this great tutorial works also in Flash CS 3
written by bijay limbu , November 05, 2007
I like this site and hope to be more better and brings new tutorials for reader and flash practiser.
written by zealmurapa , November 19, 2007
you are great can you be contacted
written by zealmurapa , November 19, 2007
can you be contacted
written by Naratip , December 05, 2007
It's easy to follow. I'm newbie for flash. Thanks for tutorial. :)
written by Rhees , December 19, 2007
Hello, I am a newbie in flash. I tried your instructions with CS3 and it worked but the transition from one picture to the next is quite sudden, my heart leaps so to speak. How do I make the transition more flowing (not so sudden)
written by Abhishek , December 30, 2007
Hi i want to do slide show of photoes with the help of flash 8. In that slide show i wants lot of different - different effects on photoes. Plz provide me idea how to do. Regard Abhishek
written by Joseph S. , January 09, 2008
you just save my day once again,Anas..Thanks What are youup to lately I'm looking forward to your next tutorials. What ever, have a nice oneand happu new year 2008!!
written by Bhagyashri , January 17, 2008
Hi i want to do Rotation of circle or image. Plz provide me idea how to do. Regard Abhishek
written by Mark , February 08, 2008
On step 8 I am trying to add the second image to frame 51 of layer 2, but when I drag the image to the stage, it does not stay on the stage (or at least it is not visible and I cannot modify it). Any ideas what I am doing wrong?
written by Kim , February 14, 2008
niceee ... just what i was looking for. if i was able to crawl trough the network cable and kiss you i would
written by bhagyshri , March 08, 2008
Thanks for this great tutorial works also in Flash CS 3
written by jack , March 09, 2008
well done tkx for sharing your nolege,it when well step by step it's all so simple just practic guys,tkx again
written by Drew P. , March 10, 2008
Thanks a bunch. Never touched Flash before in my life. Got a copy of Flash CS3. I couldn't figure out how to get started. Found this site and followed your instructions to the letter! It worked perfectly. I know just enough to build upon what you've given me/us with this tutorial. I can take it from here, but thanks so much again, for the kick start!
written by Drew , March 23, 2008
This was EXCELLENT! THANK YOU!! THANK YOU!!!
written by kathy larrabee , March 25, 2008
i want to do Rotation of images that slowly load from 1 movie clip to the next so that 20 photos eventually are open on the screen, I tried but out of 20 maybe 10 open randomly. I would like them to go in order form mc1 to mc20. can you help
written by Suz , April 03, 2008
Need more -- Great tutorial - worked like a charm for my small slideshow. But what if I have 35 images?? Doesn't seem like this would be the best approach - any advice? The small one is on the site, but large one not yet.
written by Roger Wood , April 03, 2008
Im doing a fade in of several symbols to make one still pic when all the transitions have completed... everything is transitioning in and then suppose to stop and hold. But how do i get the first symbol that fades in, (which is the main background for everything else to lay on) to stay for the duration of the show? Right now it just fades in and then shuts-off/disappears. Sincerely - Thanks Much - RW
written by Gazie , April 25, 2008
Thanks so much for this tutorial! I used Flash CS3 and only had a few small issues to solve as I went along. I changed the transitions to overlap, so that as one fades out, the next one is fading in. Very nice! Thank you!
written by emily , May 06, 2008
this was great thank you but how do i make it so it plays a continuous loop
written by AfroSamurai , May 09, 2008
This is awesome. Simple and on the money. Thanks for your effort & time on this tutorial as well as publishing it free. We love your work n looking forward for more stuff. Cheers ! Do you need more help? Ask now!
|
|
| Last Updated ( Friday, 28 March 2008 ) |
