Solved

Fade in/fade out button in flash

Posted on 2007-03-21
6
446 Views
Last Modified: 2010-04-03
I need a make an animated button in Flash that just fades in from alpha 0 to alpha 100 on rollover, and fades back out on rollout.  I would prefer to do it with AS, and have 'walked' through several tutorials on google, but I'm just not getting the jist of it...

(I have found some EE question/solutions on this, but the links to the solutions have expired or now broken, or refer to older versions, I am now using Flash 8, if that matters a whole lot)
0
Comment
Question by:cdr21
  • 3
  • 3
6 Comments
 
LVL 5

Expert Comment

by:victmo
ID: 18767561
Hi cdr21,

You can do the following...

1.- Create a movieclip which is gonna be you button, it can contain an image or any graphic.
2.- Create a new layer inside your movieclip (this is where we're putting the code)
3.- Add the following actionscript in the first frame of the layer you just created:

tvar initAlpha = 50; //Chage to set the starting alpha value
var vel = 0.3; //Change to set the velocity of the fade in/out, Max value = 1

this.newAlpha=initAlpha;
this.onEnterFrame=function(){_alpha+=(newAlpha-_alpha)*vel;};
this.onRollOver=function(){newAlpha=100;};
this.onRollOut=this.onReleaseOutside=function(){na=0;};

Good Luck,

Vic
0
 

Author Comment

by:cdr21
ID: 18767760
Ok I did the following:

Inserted a new layer where the button needs to live on the main timeline
Drew a new rectangle to serve as the button; converted it to a MC, called it anim1
Double clicked in the new rectangle MC, to acces its timeline
Pasted your code in the first frame
Saved everything... tried the movie... just seeing a new blue rectangle I just drew, no animation :(

0
 
LVL 5

Accepted Solution

by:
victmo earned 500 total points
ID: 18768514
Hi Again,

Sorry, I had some finger problems...
on the first line its "var", not "tvar"...
on the last line its "newAlpha=0", not "na=0"...

Please try it and tell me if it works. The corrected code goes as follow:

var initAlpha = 50; //Chage to set the starting alpha value
var vel = 0.3; //Change to set the velocity of the fade in/out, Max value = 1

this.newAlpha=initAlpha;
this.onEnterFrame=function(){_alpha+=(newAlpha-_alpha)*vel;};
this.onRollOver=function(){newAlpha=100;};
this.onRollOut=this.onReleaseOutside=function(){newAlpha=0;};

Good luck,

Vic
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 

Author Comment

by:cdr21
ID: 18769046

Hey, Vic, that works!

Where should I put a geturl statement to make the button fully functional - in this case linking to an external url?
0
 

Author Comment

by:cdr21
ID: 18774473

Thanks for all your help Vic!

I got the geturl statement below to work, placing it just above your code

this.onRelease = function() {
 getURL("javascript:openFEP('ktre')");
 };
0
 
LVL 5

Expert Comment

by:victmo
ID: 18777874
Yeap, thats correct, you can place your code there or on the object:

on(release){
  //your code
}

Glad it worked,

Vic
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Here are some practices and techniques that can be adopted into your Flash/Flex application development process. Note: Not all "performance tips" provide an immediately-recognizable benefit.   This article does not include timing validation data,…
In my long career of working as an actionscript developer, I had spent sleepless night often working hard to solve some small problems which actually took a lot of my development time; later found out the solutions to be a line or two. Here are s…
The goal of the tutorial is to teach the user how to live broadcast using Flash Media Live Encoder and connecting it to YouTube to broadcast. Log into your Youtube account, choose live stream settings, start live stream from Flash Media Live Enc…
The goal of the tutorial is to teach the user how to how to load their YouTube profile onto Flash Media Live Encoder.

919 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now