Changing the Mouse Cursor

You can change the basic properties of the mouse cursor by using Cascading Style Sheets. This is where you give a specific element an ID or a class and when the mouse is placed over that element then the mouse cursor changes to that specific definition.

The first thing you need to do is decide which elements you want to change the mouse cursor for, then give it a specific class:

This defines the image as class "handimage", you then need to define the style for the "handimage" elements. This is done in the stylesheet of the document:

This means that when the mouse cursor is placed over the image the pointer will change to a hand, the cursor that appears over hyperlinks. This feature is only supported by Internet Explorer 4 +, the next releases of Netscape are planned to also support this.

There are several values that the "cursor" can take. These can be:

• auto
• crosshair
• default
• hand
• move
• e-resize
• ne-resize
• nw-resize
• n-resize
• se-resize
• sw-resize
• s-resize
• w-resize
• text
• wait
• help

If you place the mouse cursor over each of the list items above, if you are using a compliant browser, then you should see the cursor that is generated.