Vertical Follower Menu, Beginner - Intermediate Options

[cmonney]

The Vertical Follower Menu
_by cmonney

Introduction
We are going to see in this tutorial how to achieve very simple, one elegant and innovative "gallery" menu: the vertical follower menu. There are of course several ways to do it, but I'm about to show you; in my opinion, the easiest way to create it...

See preview :: HERE ::

[ vertical follower menu ]

Steps to Create Animation

Please download the partial source first:  vertgal_a.swi ( 7.08K ) Number of downloads: 683


The following steps will help you to create the animation you see above:

i. Open the source provided. You will find two sprites, one of them (menu) will have another sprite inside (button) and a shape (menuBG).

ii. With the "menu"; sprite selected, change to the script panel and enter the following code:

CODE

onload () {
speed = 15
}
onEnterFrame() {
ypos = _root._ymouse;
_y += (ypos-_y)/speed;
}

Note: If you test your movie in the player (do not test it in SWiSHmax, it will give you an error in the Debug panel. "_ymouse" is not supported it in flashplayer4 (the one used in the SWiSHmax appl)) you'll see how the "menu" sprite follows the mouse/pointer "Y" position.

iii. With the "menu" sprite still selected, create a dynamic textbox (font: _sans, size: 10, color: white) in the left side of the sprite. Name it "description" and DO NOT check the target box.

iv. Open the "button" sprite inside "menu", and select "trigger&bg". Change to the script panel and enter the following code in the "on(Press)" action:

CODE

_parent.description = "picture one";

v. With "trigger&bg" still selected and in script panel, enter the following code in the "on(Press)" action:

CODE

_parent._parent.content_loader.loadMovie("pic1.swf");

Note: we are almost finish, if you test your movie in the player and click the button, the textbox will display the text (picture one).

vi. All we have to do now is copy and paste the button. Position 'em and make the respective changes (name, label, description & content to load) to each one of them.

There you have it, easy as pee your pants in winter. I hope you enjoy this effect, and please... fell free to experiment with this lil' technique and show us your work. That's all the time I have for now, see you guys/gals in the boards. And remember..

Keep On SWiSHing!

[oliverp]

cool...helped me a lot

[golffy]

Thanks a lot. It looks cool. I'll try it.

[sharlsw]

excellent tute

[afsun2003]

nice tutorial...

[erbe0279]

just great thanx a lot

[BMW_CHUBB]

Carn't download the source file but was going to have a go at this tutorial.

This post has been edited by BMW_CHUBB: Mar 1 2006, 02:26 PM

[*D*]

Carn't download the source file but was going to have a go at this tutorial.

You'll have to follow the tut on this until cmonney re-uploads the file, I do have this on my PC I'll search later for you.

[BMW_CHUBB]

You'll have to follow the tut on this until cmonney re-uploads the file, I do have this on my PC I'll search later for you.

Thank you Trueer.

[osta90]

Thanks for share it