# Mouse over text effect

**URL:** <https://forum.kirupa.com/t/mouse-over-text-effect/28941>\
**Category:** Uncategorized\
**Created:** [August 20, 2003, 12:02pm UTC](https://forum.kirupa.com/t/mouse-over-text-effect/28941 "2003-08-20T12:02:26Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Kalim](https://avatars.discourse-cdn.com/v4/letter/k/c6cbf5/32.png) [@Kalim](https://forum.kirupa.com/u/Kalim)\
**Post date:** [August 20, 2003, 12:02pm UTC](https://forum.kirupa.com/t/mouse-over-text-effect/28941/1 "2003-08-20T12:02:26Z")

</div>

Hi friends,  
I need to make a mouseover effect for text. When i take the cursor on text button it should enlarge smoothly and when i take  
it out, text button should go back to initial stage.  
Can any one tell me the better way to do this?

regards,

---

<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:** [August 20, 2003, 1:20pm UTC](https://forum.kirupa.com/t/mouse-over-text-effect/28941/2 "2003-08-20T13:20:08Z")

</div>

first make your text into a button  
in the button editting panel put key frames into each state: up, over, down (not hit)  
select the over state and convert it to a movie clip.  
double click to go to editting area.  
create motion tween of button enlarging.  
go back to button editting area.  
make hit area if you want.  
put button onto main stage.

hope that helps

---

<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:** [August 20, 2003, 1:21pm UTC](https://forum.kirupa.com/t/mouse-over-text-effect/28941/3 "2003-08-20T13:21:25Z")

</div>

PS  
dont forget to put a stop action in the last frame of the over state animation!

---

<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:** [August 20, 2003, 1:24pm UTC](https://forum.kirupa.com/t/mouse-over-text-effect/28941/4 "2003-08-20T13:24:15Z")

</div>

attached a .fla for you.

---

<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:** [August 20, 2003, 1:30pm UTC](https://forum.kirupa.com/t/mouse-over-text-effect/28941/5 "2003-08-20T13:30:31Z")

</div>

Suehami, by what you just said, wouldn’t that not go back to it’s original stage but instead just jump pack to small? Sorry in advance if the fla you posted fixed it, I’m at work so no flash for me.

---

<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:** [August 20, 2003, 4:11pm UTC](https://forum.kirupa.com/t/mouse-over-text-effect/28941/6 "2003-08-20T16:11:43Z")

</div>

Maxtrosity … um maybe i misunderstood the question… I thought kalim wanted exactly that … the button to go back to it’s initial state … ie small.

If not then sorry for wasting your time kalim. ☹

---

<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:** [August 20, 2003, 4:54pm UTC](https://forum.kirupa.com/t/mouse-over-text-effect/28941/7 "2003-08-20T16:54:58Z")

</div>

put your text in a movie clip - actionscript-

```auto

on(rollOver){
(_xscale<200)?(_xscale+=(200-_xscale)/5 ; _yscale+=(200-_xscale)/5) : (_xscale=200)}
on(rollOut){
(_xscale>100)?(_xscale-=(_xscale-100)/5 ; _yscale-=(_xscale-100)/5) : (_xscale=100)}

```

---

<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:** [August 21, 2003, 7:14am UTC](https://forum.kirupa.com/t/mouse-over-text-effect/28941/8 "2003-08-21T07:14:22Z")

</div>

Thanks guys,

yes suehamii i need that to go back to initial stage smoothly. what u said will take it to initial stage suddenly.  
Anyway i did that in a lil better way. i will try to find a more better way later.

i believe jugnu’s script should work. this will save the file size too. thanks jugnu.

regards,

---

<div class="post-metadata">

**Author:** ![hank\_freid\_hote](https://avatars.discourse-cdn.com/v4/letter/h/9de053/32.png) [@hank\_freid\_hote](https://forum.kirupa.com/u/hank_freid_hote)\
**Post date:** [June 18, 2008, 7:16am UTC](https://forum.kirupa.com/t/mouse-over-text-effect/28941/9 "2008-06-18T07:16:41Z")

</div>

Create 2 static frames (set Delay to “Stop”) with small and large images. Set small image OnOver action to jump to Frame 2 and set large image OnOut action to jump back to Frame 1:

**[COLOR=DarkRed]1.[/COLOR]** Launch Flash Designer. Choose “Frame” \> “Frame Size” to set movie dimensions to match your image size.  
**[COLOR=DarkRed]  
2.[/COLOR]** Choose “File” \> “Import Image”. Select image file and and click OK. Choose “Edit” \> “Align” \> “Center On Page” if necessary.  
**[COLOR=DarkRed]  
3[/COLOR].** Choose “Frame” \> “Frame Delay”. Check “Stop” and click OK. This will create static frame instead of animated.

**[COLOR=DarkRed]4.[/COLOR]** Choose “Frame” \> “Insert” and select “Before Current Frame” to add a blank frame at the beginning.

[COLOR=DarkRed] **5.** [/COLOR] Choose “File” \> “Import Image” to import the same image, or use “Copy” & “Paste” to copy the image to the first frame.

**[COLOR=DarkRed]6.[/COLOR]** Choose “Select” tool and decrease the image on the first frame.

**[COLOR=DarkRed]7.[/COLOR]** Make sure the smaller image is selected with the selection tool so you can apply OnOver effect. Choose “Item” \> “Actions” \> “On Over”.

**[COLOR=DarkRed]8.[/COLOR]** Select “Go to Frame” and choose “Frame 2”. Click OK.

[COLOR=DarkRed] **9.** [/COLOR] Go to the second frame (Frame 2) and select large image with the “Select” tool.

[COLOR=DarkRed] **10.** [/COLOR] Choose “Item” \> “Actions” \> “On Out”.

**[COLOR=DarkRed]11.[/COLOR]** Select “Go to Frame” and choose “Frame 1”. Click OK.

[COLOR=DarkRed] **12.** [/COLOR] Press F9 to preview the animation.

:party: