PDA

Click to See Complete Forum and Search --> : fade in/out using actionscript?



greenp
11-11-2003, 10:43 AM
Can anyone tell me how to make images fade in then out again in sequence using actionscript? I'm a novice and have the fade out code but can't make it fade in again.

So far I have this script on one image :

onClipEvent (load){
this._alpha = 100;
i = 1;
}

onClipEvent (enterfame){
if (i<=100){
this._alpha = i;
i ++;
};
}

Can anyone help me fade it in again please:? Followed by other images doing the same thing.

catbert303
11-11-2003, 11:14 AM
Hi,


onClipEvent(load) {
this._alpha = 0;
this.dir = -1;
}
onClipEvent(enterFrame) {
if (Math.round(this._alpha) == 0 || Math.round(this._alpha) == 100) {
this.dir *= -1; // change the direction of the fade
}
this._alpha += this.dir;
}

greenp
11-11-2003, 12:18 PM
Thanks for the code. It works well. I almost understand it but not enough to know how to speed up / slow down the fade rate. Or to have another image fading in as first image fades out, on the same area.

Can you tell me how to do that aswell?

It'd be great if you could.

catbert303
11-11-2003, 12:43 PM
Hi,

the trick to controling the speed of the fade is this line,

this._alpha += this.dir;

to perform the fade the variable this.dir alternates between being either +1 or -1, so the line above either adds 1 or subtracts 1 from this._alpha (depending on the current value of this.dir) you can speed up the fade effect by mutiplying this.dir by some value, for example,

this._alpha += 5 * this.dir;

so now instead of adding or subtracting 1 each frame it is adding or subtracting 5 (the fade is 5 times faster)

it is possible that when using a larger step size the condition that reverses the direction of the fade,

if (Math.round(this._alpha) == 0 || Math.round(this._alpha) == 100)

will not be met because the rounded alpha value has gone from being less than 100 to being greater than 100 without ever having the value 100 (and the same could happen at the other end of the scale, 0)

the code can be modified to prevent this happening like this,


onClipEvent(load) {
this._alpha = 0;
this.dir = -1;
this.speed = 5; // the value used to modify the speed of the fade
}
onClipEvent(enterFrame) {
if (this._alpha <= 0) {
this._alpha = 0; // if the alpha value had gone negative, reset it to zero
this.dir *= -1;
}
if (this._alpha >= 100) {
this._alpha = 100; // similarly if it had exceeded 100 reset it to 100
this.dir *= -1;
}
this._alpha += this.speed * this.dir;
}


you could add a clip that fades out as this clip fades in the vice versa by giving the other clip the same actions with the starting values of this._alpha and this.dir reversed, like this,


onClipEvent(load) { // start this clip fully visible and have it begin to fade out
this._alpha = 100;
this.dir = 1;
this.speed = 5; // the value used to modify the speed of the fade
}
onClipEvent(enterFrame) {
if (this._alpha <= 0) {
this._alpha = 0; // if the alpha value had gone negative, reset it to zero
this.dir *= -1;
}
if (this._alpha >= 100) {
this._alpha = 100; // similarly if it had exceeded 100 reset it to 100
this.dir *= -1;
}
this._alpha += this.speed * this.dir;
}


hope it helps :)

maden
04-19-2009, 11:31 PM
Hi,


onClipEvent(load) {
this._alpha = 0;
this.dir = -1;
}
onClipEvent(enterFrame) {
if (Math.round(this._alpha) == 0 || Math.round(this._alpha) == 100) {
this.dir *= -1; // change the direction of the fade
}
this._alpha += this.dir;
}


hi,

ur code is a big help for me also,
but can i ask what is the code if its just fading in only?
thank u so much

Panthea
04-21-2009, 03:15 PM
Here's something a friend of mine gave me when I asked him much the same question:

MyMov._alpha=0; //invisible
var FadeAmount=5; //start value (essentially you change the # to either increase or decrease the speed, the higher the number the faster the fade amount

MyMove.onEnterFrame=function(){
this._alpha+=FadeAmount; //apply fade amount +5 or -5
if(this._alpha<=0){ // if at min
FadeAmount=-FadeAmount; //invert
}
if(this._alpha>=100){ // if at max
FadeAmount=-FadeAmount; // invert
}
};

Hope this helps you understand what controls what :)