Skip to main content
iezqandarzulqarnaen
Known Participant
August 9, 2017
Answered

Button Hover

  • August 9, 2017
  • 3 replies
  • 4115 views

Hi,

Really need a help.

I have Button name btnSub (instance : btnSub_btn) inside MovieClip named btnMain_mc (instance : btnMain)

and I want it to play label "animate" in MovieClip named hover_mc (instance name hover) when mouse over on btnSub.

Thank you.

cc. Colin Holgate

.fla file : http://pixelsbooth.my/public/hover_test.fla

This topic has been closed for replies.
Correct answer just.emma

Since you're working in AS3, you should use:

btnMain.btnSub_btn.addEventListener(MouseEvent.MOUSE_OVER, over);

function over(event:MouseEvent):void

{

this.hover.gotoAndPlay("animate");

}

If you were working in HTML5 Canvas (which is better long term since Adobe is discontinuing the Flash Player in the next few years), it would look like:

stage.enableMouseOver();

this.btnMain.btnSub_btn.addEventListener("mouseover", over.bind(this));

function over()

{

  this.hover.gotoAndPlay("animate");

}

For future reference, from Animate you can go to Window > Code Snippets to find examples of simple scripts like these.

3 replies

Inspiring
August 9, 2017

When I try your example, it seems like the animation doesn't play every other time you move the mouse over the button. Though I notice that when the animation doesn't play, it looks like a slightly bigger square appear, so it seems like the hover animation is stuck on some frame.

you could try to find out what frame the hover movieclip is currently on after you call gotoAndPlay, using "hover_mc.currentFrame". If you don't get the same result every time, then something is wrong with the playback.

I got it to work with a button and hover effect as separate symbols on the stage, with this code:

var button = this.Button;

var hover = this.Hover;

stage.enableMouseOver();

button.addEventListener("mouseover", ButtonHover);

function ButtonHover () {

    hover.gotoAndPlay("animate");

}

I also got it to work by placing a movieclip with an animation on the over frame inside a button. For that you don't need to trigger the movieclip to play, you just need to add "this.stop();" to the last frame of the animated movieclip if you don't want it to loop.

just.emma
just.emmaCorrect answer
Inspiring
August 9, 2017

Since you're working in AS3, you should use:

btnMain.btnSub_btn.addEventListener(MouseEvent.MOUSE_OVER, over);

function over(event:MouseEvent):void

{

this.hover.gotoAndPlay("animate");

}

If you were working in HTML5 Canvas (which is better long term since Adobe is discontinuing the Flash Player in the next few years), it would look like:

stage.enableMouseOver();

this.btnMain.btnSub_btn.addEventListener("mouseover", over.bind(this));

function over()

{

  this.hover.gotoAndPlay("animate");

}

For future reference, from Animate you can go to Window > Code Snippets to find examples of simple scripts like these.

iezqandarzulqarnaen
Known Participant
August 9, 2017

Hye just.emma,

Thanks for ur time.

I've put it in timeline then got below msg:

ArgumentError: Error #2109: Frame label animate not found in scene animate.

at flash.display::MovieClip/gotoAndPlay()

at hover_test_Scene1_fla::MainTimeline/over()

just.emma
Inspiring
August 9, 2017

It worked fine when I tested it: Dropbox - hover_test_iezqandarzulqarnaen

Legend
August 9, 2017

So... put the movieclip you want to play in the over state frame of the button. That's what it's there for.

iezqandarzulqarnaen
Known Participant
August 9, 2017

Hye there thank for the reply,

i have done it, but the hover respond is slow,

there some kind of delay after the second hover if do it fast.

test it here please hover_test

Thank you.