# Masking a button

**URL:** https://forum.kirupa.com/t/masking-a-button/8600
**Category:** Uncategorized
**Created:** [November 24, 2002, 9:29pm UTC](https://forum.kirupa.com/t/masking-a-button/8600 "2002-11-24T21:29:00Z")
**Posts on this page:** 7
**Page:** 1

<div class="post-metadata">

### Author: ![chalkboard2](https://avatars.discourse-cdn.com/v4/letter/c/d9b06d/32.png) [@chalkboard2](https://forum.kirupa.com/u/chalkboard2)
#### Post date: [November 24, 2002, 9:29pm UTC](https://forum.kirupa.com/t/masking-a-button/8600/1 "2002-11-24T21:29:00Z")

</div>

hey i was just wondering how i could make a mouse over masking effect with a button. theres an example of what i mean at [http://www.fontsforflash.com/](http://www.fontsforflash.com/) their buttons on the left is what im trying to achieve. i dont know if thats called masking or not, but whatever it is its pretty neat. if you could help out that would be great! 🙂

---

<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: [November 24, 2002, 9:29pm UTC](https://forum.kirupa.com/t/masking-a-button/8600/2 "2002-11-24T21:29:49Z")

</div>

oh yes, i use flash MX

---

<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: [November 24, 2002, 9:36pm UTC](https://forum.kirupa.com/t/masking-a-button/8600/3 "2002-11-24T21:36:08Z")

</div>

just make a button! And in the “over” state make a new movieclip where you can add the effect.  
First make the new box or whatever is sliding from left to right there. (a skewed box perhaps)  
animate it moving from left to right. [the thing sliding has to be a movieclip symbol!]  
(in frame 1 move it on the left, in frame 10 (for example) move it to the right and right click on frame one and “create motion tween”)  
now you should know the basics of masking.  
[http://www.kirupa.com/developer/masking.asp](http://www.kirupa.com/developer/masking.asp) \<-- a good tute for start.  
then make a new layer then draw the area where you want the animation to be shown. and right-click on the layer and “mask”  
:]

---

<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: [November 24, 2002, 9:44pm UTC](https://forum.kirupa.com/t/masking-a-button/8600/4 "2002-11-24T21:44:33Z")

</div>

You can do it by making a movieclip that has a orange rectangle with a mask tweening over it. Then place that movieclip on the over state of your button. I attached a simple fla to help you see what I’m talking about. =)

edit: aww man, syko beat me to it. :-\ hahaha

---

<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: [November 25, 2002, 2:51pm UTC](https://forum.kirupa.com/t/masking-a-button/8600/5 "2002-11-25T14:51:22Z")

</div>

: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: [November 25, 2002, 9:26pm UTC](https://forum.kirupa.com/t/masking-a-button/8600/6 "2002-11-25T21:26:41Z")

</div>

hey sweet, i figured it out. haha i didnt realize it was so simple, anywho, thanks for both of your guys’ help with this little problem that i had. 🙂

---

<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: [November 25, 2002, 9:30pm UTC](https://forum.kirupa.com/t/masking-a-button/8600/7 "2002-11-25T21:30:36Z")

</div>

Np =)
