Navigation similar to draftdigital.com

Hi,

I’m trying to find a tutorial and/or a fla that is similar to the effect that they use on the navigation at www.draftdigital.com

If you click on work and view the client list, that’s the effect I’m trying to emulate.

Thanks in advance.

Something like this?

scotty(-:

Thanks for taking the time to put this together.
I really appreciate it.

The buttons are not staying scaled if you click on them, if I click and drag the mouse away from the button it stays scaled but it I release the mouse when I’m still on the button it doesn’t stay scaled.

Is it possible to fix this?

Thanks for your help!

Hi,

Sorry to double post but I’ve tried to figure this problem out but I can’t.
Thanks.

I’m not sure if this is what you’re after…
Have a look and let me know:)

scotty(-:

Thanks again—you’re awesome!

Just one more question.

I want to load external .swf files into the same movie the navigation will be in I will probably load it into an empty mc. How do I add a loadMovie(); action to the buttons?

The easiest way (if you want to stick to my code) is making a new array with your swf’s in it eg movArray.

movArray = new Array();
movArray = ["home.swf", ........etc,"contact.swf"];

Make an empty movieclip with the instancename “box” and change the code in the onRelease like this:

	but.onRelease = function() {
		box.loadMovie(movArray[this.i]);
		setButtons(this.i);
	};

scotty(-:

How do I set a function to change the color if you press on the button
and then have it revert back to the original color in you click on another button?

You can do it two ways:
use setRGB() or
make a second frame in your button mc (put a stop in the first;)), color that like you want.
Then add in the setButtons function (if(j!=k)

this["bt"+j].gotoAndStop(1);

and in the else part

this["bt"+j].gotoAndStop(2);

scotty(-:

Ok, I tried the setRGB function, but it’s not working.
I think I did it wrong, please see code below.

MovieClip.prototype.easeIn = function(tar) {
	this.onEnterFrame = function() {
		this._xscale = tar-(tar-this._xscale)/1.1;
		this._yscale = this._xscale;
		if (Math.abs(tar-this._xscale)<1) {
			this._xscale = this._yscale=tar;
			delete this.onEnterFrame;
		}
	};
};
title_array = new Array();
title_array = ["ABC TELEVISION", "ABC RADIO", "BETHEL WOODS", "BRANDOPOLY", "HOME BOX OFFICE", "INFINITY BROADCASTING", "INTEREP", "JVC", "SMITHSONIAN"];
movArray = new Array();
movArray = ["home.swf","test.swf","contact.swf"];
for (i=0; i<9; i++) {
	but = this["bt"+i];
	but.i = i;
	but.bt_info.text = title_array*;
	but.onRollOver = function() {
		this.easeIn(175);
	};
	but.onRollOut = function() {
		this.easeIn(100);
	};
	but.onRelease = function() {
		box.loadMovie(movArray[this.i]);
		setButtons(this.i);
		setColor(this.i);
	};
}
//function to set the buttons
function setButtons(k) {
	for (j=0; j<9; j++) {
		//for the buttons that aren't released
		if (j != k) {
			this["bt"+j].easeIn(100);
			this["bt"+j].enabled = 1;
			//for the one that is released
		} else {
			this["bt"+j].easeIn(150);
			this["bt"+j].enabled = 0;
		}
	}
}
//function to set the color on release
function setColor(k) {
	for (j=0; j<9; j++) {
		//for the buttons that aren't released
		if (j != k) {
			this["bt"+j].setRGB(0xCCCCCC);
			//for the one that is released
		} else {
			this["bt"+j].setRGB(0xFFFFFF);
		}
	}
}

Ah, so close=)
You’ve forgotten to define the color Object

myColor = new Color(targetmc)

Further, if you use it this way, the whole mc will get coloured, so you can’t read the text anymore (cause it’s inside the button).
A way to work around this, is make the background in the button a mc, give it the instance name “bg”, now your can look like this

function setColor(k) {
	for (j=0; j<9; j++) {
		myColor = new Color(this["bt"+j].bg);
		if (j != k) {
			myColor.setRGB(0xFFCCCC);
		} else {
			myColor.setRGB(0xFF0000);
		}
	}
}

btw, you can combine this function with the setButtons():wink:

scotty(-:

thanks so much…
I just wanted the color of the text, not the entire mc to change.
So i was fooling around with the code a bit and I targeted the text field
"bt_info" instead of the mc “bg”.

MovieClip.prototype.easeIn = function(tar) {
	this.onEnterFrame = function() {
		this._xscale = tar-(tar-this._xscale)/1.1;
		this._yscale = this._xscale;
		if (Math.abs(tar-this._xscale)<1) {
			this._xscale = this._yscale=tar;
			delete this.onEnterFrame;
		}
	};
};
title_array = new Array();
title_array = ["ABC TELEVISION", "ABC RADIO", "BETHEL WOODS", "BRANDOPOLY", "HOME BOX OFFICE", "INFINITY BROADCASTING", "INTEREP", "JVC", "SMITHSONIAN"];
movArray = new Array();
movArray = ["home.swf", "test.swf", "contact.swf"];
for (i=0; i<9; i++) {
	but = this["bt"+i];
	but.i = i;
	but.bt_info.text = title_array*;
	but.onRollOver = function() {
		this.easeIn(175);
	};
	but.onRollOut = function() {
		this.easeIn(100);
	};
	but.onRelease = function() {
		box.loadMovie(movArray[this.i]);
		setButtons(this.i);
		setColor(this.i);
	};
}
//function to set the buttons
function setButtons(k) {
	for (j=0; j<9; j++) {
		//for the buttons that aren't released
		if (j != k) {
			this["bt"+j].easeIn(100);
			this["bt"+j].enabled = 1;
			//for the one that is released
		} else {
			this["bt"+j].easeIn(150);
			this["bt"+j].enabled = 0;
		}
	}
}
//function to set the color on release
function setColor(k) {
	for (j=0; j<9; j++) {
		myColor = new Color(this["bt"+j].bt_info);
		//for the buttons that aren't released
		if (j != k) {
			myColor.setRGB(0x000000);
                 this["bt"+j].enabled = 1;
			//for the one that is released
		} else {
			myColor.setRGB(0xFF0000);
			this["bt"+j].enabled = 0;
		}
	}
}

Now, when I click on the button, the text color changes and if I rollover another button and then click on that…the previous button reverts back to the original color and the one I just clicked changes.

woo hoo!!!

Thanks so much for helping me to get this to work!!!

P.S. would it make the coding cleaner and a bit smaller if I combined the setButton and setColor functions like you suggested in your last post?

Glad you’ve got what you want=)
About the coding, I think I would combine them, but having those functions apart can give a better oversight, so it’s up to you:)

scotty(-: