Introduction: How to Make a Custom Cursor in Flash

Picture of How to Make a Custom Cursor in Flash

This is a simple tutorial to show you how you can change the simple arrow cursor to pretty much anything you want in Adobe Flash.

Step 1: Getting Started

Picture of Getting Started

Create a new Flash document. If you are using the CS3 Suit, choose the actionscript 2.0 option. The size of your work space does not matter. Since this cursor will probably be for your project (web page, etc), make the dimensions whatever you wish.

Once you have created a new document. Change the frame rate to 30fps at the bottom in the Properties panel for smoother movement.

Step 2: Making the Cursor

Picture of Making the Cursor

Rename your first layer in the timeline 'cursor'. Your custom cursor can pretty much be anything you want. If you want to use a photo, then upload it your stage and make it a movie clip. Resize it to however big you want your cursor to be.

You can also draw your custom cursor, which i did for this tutorial. To do this, select the pencil tool, choose a colour, and draw your shape. Once you have your shape, select the selection tool (arrow) and double click on your shape to select the whole thing. Press F8 to bring up the symbol box and select movie clip and name it 'cursor'. Also make sure the Registration is at the top left corner, or wherever you want the click point to be.

If you decide to use a photograph and want to publish it on the internet, beware of copyright issues.

Step 3: Instance Name

Picture of Instance Name

In your properties panel at the very bottom, under movie clip, you will see a box that says "instance name." Click on it and change the instance name to "custom_cursor."

Step 4: ActionScript

Picture of ActionScript

Create a second layer in the timeline at the top and call it "actionscript". Click on the very first key frame and hit F9 to bring up the actions box (or right click on the keyframe and select actions).

Copy and paste this code into it:

custom_cursor.startDrag("true");
Mouse.hide();

This code is telling the original cursor to hide and to replace it with the new one by using the instance name you entered before.

Close the actions box.

Step 5: Preview

Picture of Preview

Your custom cursor is complete! Just hit Control and Enter to preview your custom cursor.

Comments

drtnation (author)2008-05-26

how do you save it as your cursor

QwertyuioLP (author)drtnation2008-10-06

I'm new to flash but cursors are saved as .cur

croutonicus (author)QwertyuioLP2009-05-16

Only for use on desktop. This is a tutorial for a flash game cursor, it wont change your normal cursor. To do that save an image as untitled.cur and put it in the cursor folder of program files.

Seifpic (author)2009-02-21

At last, a tutorial about cursors in flash! Thanks!

lawizeg (author)2008-11-13

You need a handler for this. Put... on(enterFrame){ //stuff } OR on(load){ //stuff }

GorillazMiko (author)2008-03-30

Yay! I'm definitely going to try this out, great job.

About This Instructable

14,439views

8favorites

License:

More by Jenn Taylor:How To Make A Custom Cursor in Flash
Add instructable to: