Tutorial
Title: Actionscripted Fader
Time: 30 Mins
Difficulty Level: Intermediate
Summary: How to fade an mc using Actionscript.
Assumed knowledge: Tween, Functions / Global, Movieclip Actions
Author: Chris Calangi
Website: Templates247.com
Tutorial Files: Source

 

 

Preview:

 

Hi folks, here's another tutorial I made for you. Its a fading script that I usually use. But instead of using a normal tween, I use actionscript to fade images.

Fire up flash and make a new document. Import images with the same dimensions. In this case I use Templates247's logo, a colored and and a black and white one.


I imported them into the library, via File import > import to library and made each bitmap into a movieclip. In this case I made the black and white logo to "mc1" and the colored one to "mc2".

I place "mc1" in Layer 1 and place "mc2" to Layer2, Layer 2 is on top of layer 1, and I made a Layer 3 to hold some actionscript. On Layer 3 frame 1, I place this code:


_global.fader = function() {
this._alpha -= 10;
if(this._alpha < 1)
delete this.onEnterFrame;
}
_global.fader2 = function() {
this._alpha += 10;
if(this._alpha > 99)
delete this.onEnterFrame;
}

to explain this code, _global makes the function be seen on any part of the movieclip and I made it to a function, that's why its = function();

this._alpha -= 10; --> this line just reduces the alpha to 10.
if(this._alpha < 1) = checks if the alpha is less than 1

if it is it deletes the onenterframe action which is

delete this.onEnterFrame;

The same goes for the second function but this time instead of reducting the alpha it increases the alpha. So its like an "unfader" :D
The second line checks if the alpha is greater than 99 and deletes the onEnterFrame action to reduce memory usage of flash.

You should pretty much have this:

Lastly, we just attach this function to mc2

on (rollOver) {
this.onEnterFrame = fader;
}
on (rollOut) {
this.onEnterFrame = fader2;
}

what it does is just inserts an onEnterFrame action to the movieclip and calls the fader function.

So the final is here:

 

Hope you enjoy this tutorial, till next time.