Button animation

[djc]

This is a somewhat simple thing that for some reason I haven't been able to figure out. How would I make a some sort've graphic/button that would change color or fade slightly when the mouse rolls over it (with the obligatory fade back when the mouse rolls out), and also links to another scene?

[Sama7]

hi..
as u said its so simple.. just include the animation or the effect u want in a movie clip and insert the movie clip in the over state in ur button :)

have fun

[cheez]

1. draw a box
2. convert into button symbol
3. double-click on the your new button
4. you are now editing your button
5. you have 4 states: up - over - down - hit
up = no button event
over = mouse-over event
down = press-down event
hit = the size of the object here determines "hit" dimensions
6. each state is editable, either add another layer and draw "over" a certain area of the button, or make it "rotate"...

World's your oyster ;)

-Cheez

[catbert303]

i prefer to do it this way.

create a hidden button, to do this select insert > new symbol > button then when you edit the button leave the first 3 frames blank (up, over and down) just draw a filled shape in the hit frame. when you place the button on the stage it will appear as a semi-transparent blue shape, this won't be visible in the published movie though.

next create a movie clip, in frame 1 draw what you would like to appear when the button isn't being rolled over, in this frame also add the actions,

rewind = false;
stop();

then in frame 2 onwards draw your animation, in the last frame add another stop(); action, return to your main timeline and place a copy of this clip on the stage. next add a clip event to the movie clip,

onClipEvent(enterFrame) { // this code is used to make the animation play backwards on rollout
if (rewind) {
this.prevFrame();
}
}

give the clip an instance name, (here i'll use the name button_animation) and finally add some actions to your hidden button,

on (rollOver) {
this.button_animation.rewind = false; // stop the clip fading out (if it was)
this.button_animation.play(); // display the rollover animation
}
on (rollOut) {
this.button_animation.rewind = true; // set the animation playing backwards
}
on (release) {
_root.gotoAndPlay("framelabelname");
}

where framelabelname is a frame label placed somehere on the main timeline.