Effects
With Flash to create a scrolling transition effect of the exquisite gallery display animation. The effect is good, hope everybody likes.
First look at the effect:
Click here to download the FLA source file
Production method:
First create a new flash document and then modify the document properties:
We made this gallery, you can see by the demo Click Small Map, you can dynamically display large image, so we have to do some work beforehand. Prepare some of the same size of the picture 8, and the corresponding thumbnail 8, the big picture into Flash, respectively, converted to film clip components, small thumbnail import flash into the film clip components, are placed inside the library, keep us to use.
Here we make a main master movie clip and create a background in it:
Then create a new layer, the thumbnails are arranged in order, the instance names are Thumb0, THUMB1, THUMB2, THUMB3, Thumb4, Thumb5, Thumb6, Thumb7:
When you import a large image into Flash, press F8 to change to a movie clip symbol, which is IMAGE0, Image1, Image2, Image3, Image4, Image5, Image6, Image7, respectively. The settings are as follows:
Then create a layer and enter the following code:
This.createemptymovieclip ("Images", 100);
This.attachmovie ("Mask", "Mask", 101);
mask._x = images._x =-68;
mask._y = target =-150;
Images._y =-1000;
Images.setmask (mask);
Speed = 5;
for (var i = 0; i<8; i++) {
var img = Images.attachmovie ("image" +i, "image" +i, i);
img._y = Img._height*i;
var thumb = this["thumb" +i];
Thumb._alpha = 60;
Thumb.pos = target+ (i*-img._height);
thumb.onpress = function () {
target = This.pos;
};
Thumb.onrollover = function () {
This._alpha = 100;
};
Thumb.onrollout = function () {
This._alpha = 60;
};
}
This.onenterframe = function () {
Images._y + = (target-images._y)/speed;
};
Finally, I made a loading. Press the test!