|
Crosshair Target Custom Cursor |
|
|
|
Written by Rawpulse
|
|
Tuesday, 28 March 2006 |
|
Learn how to make a crosshair taret custom cursor
Today you'll learn how to create a custom cursor, to replace the regular white pointer. This is often seen on Flash websites and within games, if the white cursor is out of place or takes away from the theme of the site. This tutorial was made with Flash Professional 8, although most, if not all can be done in previous versions.
For this tutorial, you should know your way around Flash. We are going to replace the cursor with a target. Click here to view an example of the finished product.
So, the first thing to do is set the background color to black, via the Properties menu. Now, on layer 1, select the Oval tool. Turn off the fill color, and ensure the stroke color is red. Set the stroke size to around 4 from the Properties menu. Hold the shift key as you draw your circle, to ensure it stays perfectly round.

Now, draw a vertical line with the same stroke settings, using the line tool. Select the line, and copy it. Place it in a similar position to this:

Paste the line, and position it on the bottom of the circle.

Paste the line two more times. This time they need to be positioned on the left and right hand side, horizontally. To flip them horizontally, select them, and go to Modify > Transform > Rotate 90 degrees CW.

Adjust the four lines so they are symmetrical. To make it a little more realistic, select the Oval tool once more, and add a small red dot in the center.

Now you have finished the cursor. Select the entire target by pressing Control + A. Convert it to a movie clip, by pressing F8. Call it "target". Now we need to add the Actionscript. There isn't much code to do this, but it will be explained afterwards.
Code:
onClipEvent (load) { Mouse.hide(); } onClipEvent (enterFrame) { this._x = _parent._xmouse; this._y = _parent._ymouse; }
The first onClipEvent hides the standard white mouse cursor. The second ensures that the position of the movie clip is always updating, and following the invisible cursor. The X and Y is referring to the X axis and the Y axis, which the movie clip moves along.
Now you're finished. Test your movie by pressing Control + Enter. You should be able to see your target following the mouse cursor (which is hidden). To view the example of what it should look like, click here. If you have encountered a problem during this tutorial, tell us about it on the forum, and we'll help you.
|
|
Last Updated ( Tuesday, 28 March 2006 )
|