# Button roll-over effects like Macromedia site?

**URL:** <https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971>\
**Category:** flash\
**Created:** [February 6, 2003, 9:54pm UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971 "2003-02-06T21:54:22Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![barnettgs](https://avatars.discourse-cdn.com/v4/letter/b/85e7bf/32.png) [@barnettgs](https://forum.kirupa.com/u/barnettgs)\
**Post date:** [February 6, 2003, 9:54pm UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/1 "2003-02-06T21:54:22Z")

</div>

I am looking for button roll-over effect, exactly the same as the ones in marcomedia site which fade slowly after your mouse moves out. It is tricky to make? I’m only newbie on the world of Flash MX.

Also what is best learning methods for learning to use flash? Like college course, on your own, samples or learning book etc

Thanks

---

<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:** [February 7, 2003, 10:41am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/2 "2003-02-07T10:41:07Z")

</div>

There was a post on the action script forum about this as well. If you go through the MX tutorial you put 3 buttons in it that have a background colour fade in under the semi transparent buttons… If you need an example, its already on your computer, hehe… Unless ofcourse you deleted the tutorials 🙂

---

<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:** [February 7, 2003, 2:21pm UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/3 "2003-02-07T14:21:11Z")

</div>

Tutorial doesn’t cover the buttons from macromedia site, nor are samples files too.

I’m hoping anyone here have the samples so that I can work on them? Thanks

---

<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:** [February 8, 2003, 5:33am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/4 "2003-02-08T05:33:33Z")

</div>

the best way of learning is doing tutorials (liike the ones in kirupa :)), for me it works atleast…

and i think theres a similar rollover effect in the tutorials section here, maybe you could try that

---

<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:** [February 8, 2003, 7:18am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/5 "2003-02-08T07:18:34Z")

</div>

the effect is quite simple

its a simple mouse over and out effect, and to have the delayed reaction to the out, make the tween a bit longer than the over , so it will slowly fade out, if you want i can make a quick fla. 😏

---

<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:** [February 8, 2003, 7:24am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/6 "2003-02-08T07:24:33Z")

</div>

[http://www.kirupaforum.com/showthread.php?s=&threadid=14348](http://www.kirupaforum.com/showthread.php?s=&threadid=14348)

or …

---

<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:** [February 8, 2003, 7:28am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/7 "2003-02-08T07:28:58Z")

</div>

or u could do that, lol ,:beam:

---

<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:** [February 8, 2003, 7:37am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/8 "2003-02-08T07:37:53Z")

</div>

your method is good, though its not really like the macromedia one, the roll out is longer than the over. can this be done in code as well?

---

<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:** [February 8, 2003, 7:39am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/9 "2003-02-08T07:39:12Z")

</div>

oh !! so sorry soulty :-\

i didn’t see the _if you want i can make a quick fla_ part … :\*(

---

<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:** [February 8, 2003, 7:43am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/10 "2003-02-08T07:43:43Z")

</div>

can the delay of the out tween be done in code? using your method?

---

<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:** [February 8, 2003, 7:56am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/11 "2003-02-08T07:56:42Z")

</div>

i guess so … [size=1]untested[/size]

onClipEvent (enterFrame) {  
if (this.hitTest (\_root.\_xmouse, \_root.\_ymouse, true)) {  
this.nextFrame ()  
} else {  
this.gotoAndStop (1)  
}

like that ??

---

<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:** [February 8, 2003, 8:01am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/12 "2003-02-08T08:01:53Z")

</div>

thats the same as the fla isent it?

with that code, is it possible to have a longer tween for the out than have the same tween for both over 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:** [February 8, 2003, 8:07am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/13 "2003-02-08T08:07:43Z")

</div>

well … as i can see … there’s no **out animation** in macromedia’s buttons

?? that’s what the last code does … it plays forward and returns to its original state when your mouse is not over them …

---

<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:** [February 8, 2003, 8:10am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/14 "2003-02-08T08:10:38Z")

</div>

maybe i’m not getting your point … can you post your _quick fla_ ? so i can see what are you talking 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:** [February 8, 2003, 8:27am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/15 "2003-02-08T08:27:15Z")

</div>

ok here is the effect , as you can see the out tween is longer than the over tween, can this be done with your code??

---

<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:** [February 8, 2003, 8:31am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/16 "2003-02-08T08:31:33Z")

</div>

oh i see …

the answer is no … the code would fade in and out the mc at the same fps :-\

---

<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:** [February 8, 2003, 8:37am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/17 "2003-02-08T08:37:26Z")

</div>

could you use frame labels where the tween is, and call them for when the hittest is true and false?

---

<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:** [February 8, 2003, 9:07am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/18 "2003-02-08T09:07:54Z")

</div>

well yes … but you’d need to use a flag so it won’t keep playing the same frame **inAnimation**

onClipEvent (enterFrame) {  
if (this.hitTest (\_root.\_xmouse, \_root.\_ymouse, true)) {  
if (!flag) {  
this.gotoAndPlay(“inAnimation”)  
flag ++  
}  
} else {  
this.gotoAndPlay(“outAnimation”)  
delete flag  
}  
}

or something like that …

---

<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:** [February 8, 2003, 9:19am UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/19 "2003-02-08T09:19:47Z")

</div>

kool, i 'll give it a go. =)

---

<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:** [February 8, 2003, 12:04pm UTC](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971/20 "2003-02-08T12:04:57Z")

</div>

Thanks kax and Soulty!

They are what I wanted, cheers! I have looked at Kax’s file, I am really surprised at how simple it is, supposed I need to know more about flash! 😊

=)

[Next page](https://forum.kirupa.com/t/button-roll-over-effects-like-macromedia-site/12971.md?page=2)