Solved

Fade in/fade out button in flash

Posted on 2007-03-21
6
450 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
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

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

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

Introduction This article is primarily concerned with ActionScript 3 and generally specific to AVM2.  Most suggestions would apply to ActionScript 2 as well, and I've noted those tips that differ between AS2 and AS3. With the advent of ActionS…
While working over numerous projects I often had the requirement for doing a screen capture in AS3.0. Unfortunately I found no "ready made" solutions in google search that suited my requirements. But I did come across some great resources which help…
In this tutorial viewers will learn how to create a basic motion tween animation in Flash Open a new document in Flash: Draw/import an image: Press CTRL + F8 to convert it into a graphic symbol: Select a frame (how long you want the tween to last): …
The goal of the tutorial is to teach the user how to how to record live broadcast.

749 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