visualdesigncore.com | Mouse hide and change cursor

Mouse hide and change cursor

This tutorial will show you how to change the cursor of the mouse inside of a flash file.

1) Create anything you want your cursor to become. Highlight this, and hit f8 (Modify > Convert To Symbol) make it a movie clip, and give it the name 'cursor' (without the 's).

2) Now make a new layer, and call it 'Actions'. Add this code to the first frame:

Code:

onLoad = function () {
	Mouse.hide();
	cursor.swapDepths(1000);
};

onEnterFrame = function () {
	cursor._x = _xmouse;
	cursor._y = _ymouse;
};

onUnload = function () {
	Mouse.show();
};

I will break this code down now

Code:

onLoad = function () {
	Mouse.hide();
	cursor.swapDepths(1000);
};

This says, when the movie loads it will hide the mouse, and then it will set it's depth to a ridiculously high number so that it will appear over everything else in your final movie.

Code:

onEnterFrame = function () {
	cursor._x = _xmouse;
	cursor._y = _ymouse;
};

This says every time the movie enters this frame it will set the movie clip 'cursor's horizontal, and vertical, positions to the mouse's.

Code:

onUnload = function () {
	Mouse.show();
};

This says, when you leave this state, that it will show the mouse again. Just cleanup work, not really nescessary unless you are going to need the mouse again.

There you have it.

Adding a lag:

1) Go back and delete the code we put on the 'Actions' layer. Replace it with this:

Code:

onLoad = function () {
	Mouse.hide();
}

speed = .9;
 setInterval(CursorMovement, 40);
 function CursorMovement() {
 cursor._x = speed*(cursor._x-_xmouse)+_xmouse;
 cursor._y = speed*(cursor._y-_ymouse)+_ymouse;
}

Code:

onLoad = function () {
	Mouse.hide();
}

This hides the mouse.

Code:

speed = .9;
 setInterval(CursorMovement, 40);
 function CursorMovement() {
 cursor._x = speed*(cursor._x-_xmouse)+_xmouse;
 cursor._y = speed*(cursor._y-_ymouse)+_ymouse;
}

This sets the value .9 to 'speed'. Then puts that into use by making it the amount of easing.

If you lower the 'speed' value then you reduce the amount of easing.

Making a paddle type movement:

1) This one is very simple. Go back and delete this any line of code that has _y in it to make it move horizontaly. Or delete any line of code with _x in it to make it move only verticaly.

Source Files:
Replace the Cursor .FLA
Cursor Easing .FLA
Cursor Paddle .FLA

Mouse hide and change cursor

Quick Tutorial Search

Tutorial Categories