CSS Cursors Tutorial
NAME OF SITE : EchoEcho.Com
URL : http://echoecho.com/csscursors.htm
CSS TECHNIQUE :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.
| Look | Values | Test | Code |
|---|---|---|---|
 |
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(url) | test | cursor:url(uri) |
Please note that some of these cursors are not W3C approved. For a list of approved cursors go to : www.w3.org/TR/REC-CSS2/ui.html#propdef-cursor
For more details on how to apply this visit : http://echoecho.com/csscursors.htm