[MX] Need advice on alpha issue

programming flash
1

I’ve been reading through the previous posts on scripting alpha fades and have bookmarked some things I want to look at further dealing with functions and clip events but haven’t found anything talking about how to fade via rollover and rollout on a mc.

For example, I have an MC acting as a button. On rollover, I want to fade an image (imageMC) from 0 to 100; On rollout, I want to fade it back to 0. and on release I want to fade it to 100 and have it stay there. The tricky thing is that there are two more MCs acting as buttons. So if you rollover one of these, I want the currently displayed image to fade before going through its own rollover/rollout routine. I would need a function to do this, wouldn’t I?

So, a few questions:

  1. Can someone help me with the best way to set up my scripting…do I need a function in the first frame of the main timeline or on the buttonMCs themselves? Can I get away without using a function?

  2. How do I script an alpha tween using mouse events?

  3. Can someone point me in the right direction as to where to get started with this? Tutorials, etc.

If anyone could help, I’d really appreciate it.

2

Hi there,

Not sure whether this will help you or not but hopefully will get you pointed in the right direction. Sometimes seeing something is easier than explaining. Just create yourself a new movie and throw the following code in frame 1 and test it. Click on the buttons, rollover/out, and watch what happens.
The Math function is needed for the MC method Fade as I use Penners math tweens to achieve most of my movement. (Great book … I suggest to all). The method drawframe is just for simplicity sake and draws the squares you will see.

Play around with it. Create extra buttons to see what you can do. I think it will help you understand the concept. Good luck


//
Math.LT = function(t,b,c,d){
	return c*t/d +b;
};
//method to call
MovieClip.prototype.fade = function(startVal, endVal, speed) {
	this.begin = startVal;
	this.finish = endVal;
	this.change = this.finish - this.begin;
	this.duration = speed;
	this.time = 0;
	this.onEnterFrame = function(){
		with (this) {
			_alpha = math.LT(time++, begin, change, duration);
			if (time > duration) delete this.onEnterFrame;
		}
	};
};
//MC method to draw a square for demo purpose
MovieClip.prototype.drawframe = function(lineColour, fillColour, cw, ch, cx, cy, fillAlpha, linealpha) {
	if (itsLalpha == undefined) {
		itsLalpha = 100;
	}
	with (this) {
		lineStyle(0, lineColour, linealpha);
		beginFill(fillColour, fillAlpha);
		moveTo(cx, cy);
		lineTo(cx+cw, cy);
		lineTo(cx+cw, cy+ch);
		lineTo(cx, cy+ch);
		lineTo(cx, cy);
		endFill();
	}
};
/*****************************************************************************/
//clip0 is not fading because it is never a target for any button
var Clip0 = this.createemptymovieclip("Clip0", _global.depthlvl++);
Clip0.drawframe(0xffffff, 0xa51439, 100, 100, 200, 100, 100, 0);
//create the button events to control any clip in this case clip1
var mybutton0 = this.createemptymovieclip("mybutton0", _global.depthlvl++);
mybutton0.drawframe(0xffffff, 0xa51439, 100, 25, 200, 300, 100, 0);
//
mybutton0.onrollover = function() {
	Clip1.fade(0, 100, 5);
};
//
mybutton0.onrollout = function() {
	Clip1.fade(100, 0, 5);
};
//
mybutton0.onpress = function() {
	Clip1.fade(100, 0, 5);
	//do whatever else you like here ...
};
//
mybutton0.onrelease = function() {
	Clip1.fade(100, 100, 5);
};
/*****************************************************************************/
//this clip fades in and out and is controlled by 2 different MC buttons
//button0 created above and button1 below
var Clip1 = this.createemptymovieclip("clip1", _global.depthlvl++);
Clip1.drawframe(0xffffff, 0xa51439, 100, 100, 325, 100, 100, 0);
//
var button1 = this.createemptymovieclip("button1", _global.depthlvl++);
button1.drawframe(0xffffff, 0xa51439, 100, 25, 325, 300, 100, 0);
//
button1.onrollover = function() {
	Clip1.fade(0, 100, 5);
};
//
button1.onrollout = function() {
	Clip1.fade(100, 0, 5);
};
//
button1.onpress = function() {
	//do whatever else you like here ...
};
//
button1.onrelease = function() {
	Clip1.fade(100, 100, 5);
};
stop();