Cursors

Microsoft Internet Explorer 4+ and Netscape 6+ supports customized cursors defined with CSS.

Although the cursors will not have the customized look in other browsers it usually doesn't ruin anything. These browsers will simply show the normal arrow-cursor which would be same case as if you refrained from customizing cursors at all.

So unless the page really doesn't work without the customized cursor there shouldn't be technical reasons for choosing not to.

However there might be other reasons for thinking twice before adding custom cursor to your pages. Many users are easily confused or irritated when a site breaks the standard user interface.

I guess the best thing about it is being able to add your own customized cursors to your page!

Look	Values	Look	Example
	default	TEST	cursor:default
	crosshair	TEST	cursor:crosshair
	hand	TEST	cursor:hand
	pointer	TEST	cursor:pointer
	Cross browser	TEST	cursor:pointer;cursor:hand
	move	TEST	cursor:move
	text	TEST	cursor:text
	wait	TEST	cursor:wait
	help	TEST	cursor:help
	n-resize	TEST	cursor:n-resize
	ne-resize	TEST	cursor:ne-resize
	e-resize	TEST	cursor:e-resize
	se-resize	TEST	cursor:se-resize
	s-resize	TEST	cursor:s-resize
	sw-resize	TEST	cursor:sw-resize
	w-resize	TEST	cursor:w-resize
	nw-resize	TEST	cursor:nw-resize
	progress	TEST	cursor:progress
	not-allowed	TEST	cursor:not-allowed
	no-drop	TEST	cursor:no-drop
	vertical-text	TEST	cursor:vertical-text
	all-scroll	TEST	cursor:all-scroll
	col-resize	TEST	cursor:col-resize
	row-resize	TEST	cursor:row-resize
	cursor:url(uri)	TEST	cursor:url(uri)

So if you created your own cursors for your web page this is how you would incorporate them into your document.

Here is what you would have in your style sheet

.xlink {cursor: url(images/cursors/cursor.cur);}

And in your document you would have something along the lines of:

<a class="xlink"> ... </a>

And hey presto! There's your new cursor rather than your browsers default cursor!

If you would like to practice modifying cursors you can DOWNLOAD the green cursor here to use.

DEFINEING CURSORS FOR ENTIRE DOCUMENT
This is relativly easy, simply add this code to the BODY styles of your document.

body {
      cursor: url(images/cursors/cursor.cur);
} 

And if your interested in software to create your own icons visit Icon Cool.