# Animated Rollover Buttons for Flash MX

**URL:** https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467
**Category:** flash
**Created:** [December 12, 2002, 12:01pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467 "2002-12-12T12:01:19Z")
**Posts on this page:** 17
**Page:** 1

<div class="post-metadata">

### Author: ![Alan\_Shearer](https://avatars.discourse-cdn.com/v4/letter/a/c6cbf5/32.png) [@Alan\_Shearer](https://forum.kirupa.com/u/Alan_Shearer)
#### Post date: [December 12, 2002, 12:01pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/1 "2002-12-12T12:01:19Z")

</div>

I tried creating an animated rollover effect on a button, but I cannot get the animation work. Can someone please assist me in this matter.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 12, 2002, 12:07pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/2 "2002-12-12T12:07:38Z")

</div>

Let me re-phrase the question…  
I want to create a button which has an effect in such a way that when a mouse is moved over it, the button sort of animates. This is to say I want an animated rollover effect for the button on the Over State.  
Thanks in Advance.\<:}

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 12, 2002, 12:15pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/3 "2002-12-12T12:15:39Z")

</div>

something like this? Hope that gives you an idea. =)

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 12, 2002, 12:19pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/4 "2002-12-12T12:19:52Z")

</div>

Well… what I wanted was something related with Words. You see I am making a Flash Site… And for the “ENTER MY SITE” button, I want this kind of effect. Can you help me?  
Thanks in Advance \<:}

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 12, 2002, 12:26pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/5 "2002-12-12T12:26:23Z")

</div>

could you describe exactly what effect you’re trying to achieve? I know you want a amiated rollover on your button, but what exactly?

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 12, 2002, 12:28pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/6 "2002-12-12T12:28:27Z")

</div>

I want to create a button out of text. Then I want animate that text (which is now a button) on the Over State. For example making the text fade in and out.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 12, 2002, 12:40pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/7 "2002-12-12T12:40:24Z")

</div>

Theres a few methods to do what you want, but here’s one method. I made a movieclip containing the fade animation and I used the hittest to play the animation on rollover.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 12, 2002, 12:45pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/8 "2002-12-12T12:45:59Z")

</div>

Thanks a Lot=)

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 12, 2002, 12:53pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/9 "2002-12-12T12:53:32Z")

</div>

no problem Alan, if you have questions then feel free to ask. =)

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 12, 2002, 5:05pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/10 "2002-12-12T17:05:19Z")

</div>

electrongeek,  
If I look at your fla file, why do you have stop layers in button for? What does that flag do?

Thanks,  
nodo

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 12, 2002, 9:03pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/11 "2002-12-12T21:03:53Z")

</div>

> \*Originally posted by nodo \*  
> \*\*electrongeek,  
> If I look at your fla file, why do you have stop layers in button for? What does that flag do?

Thanks,  
nodo \*\*

Thanks for bringing that to my attention nodo, but the frame label and the stop serve no use in this particular setup. I took another sample file and modified it to do what Alan wanted, but I forgot to take out that stop layer. I did this late at night so I wasn’t paying attention. =)

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 18, 2002, 7:22pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/12 "2002-12-18T19:22:16Z")

</div>

Your site is awsome. I wish I have a skill like you.

-nodo

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 18, 2002, 7:26pm UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/13 "2002-12-18T19:26:24Z")

</div>

He electrongeek, I notice this is for Flash MX, so why are you using hitTest?

You can do

```auto
on (rollOver) {
this.gotoAndPlay(frame);
}
on (rollOut) {
this.gotoAndPlay(frame);
}

```

MX allows you to use on handlers on movie clips 🙂

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 19, 2002, 1:39am UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/14 "2002-12-19T01:39:16Z")

</div>

Lost, you should know by now that I do everything the long and hard way, I’m still a n00b for cryin out loud, but I’m glad you’re watching my back and fixing my mistakes, thanks =)

EDIT: actually I used the hitest because it seems more sensitive to the mouse, when I used the rollover method, sometimes it wouldn’t work if i rolled over it real fast.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 19, 2002, 2:38am UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/15 "2002-12-19T02:38:09Z")

</div>

Hmmm, interesting.

Now thanks for that tip electrongeek 🙂

I usually use the rollOver, but I don’t usually do complex rollOvers, so I never noticed a difference.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 19, 2002, 5:45am UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/16 "2002-12-19T05:45:45Z")

</div>

so in order for all this to work, you would make a button, then make that button a movieclip?

and lost, isnt electrons different cuz his plays in revers on rollout…yours doesnt, correct?

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [December 19, 2002, 5:55am UTC](https://forum.kirupa.com/t/animated-rollover-buttons-for-flash-mx/9467/17 "2002-12-19T05:55:12Z")

</div>

both, my method and Lost method works, I made a movieclip and used the hit test on it to play the animation inside that movieclip.
