Why is my custom cursor not showing up? I've tried .cur, .gif, .jpg and .png. None of them are showing up!
body, html {
cursor:url(images/minired/ayes/purp.cur);
cursor:url(images/minired/ayes/purp.png);
cursor:url(images/minired/ayes/purp.gif);
cursor:url(images/minired/ayes/purp.jpg);
}
The reason they are not showing up is because the cursor's themselves are not defined, you'll have to define them by adding the cursor names at the end.
Here is a list of the cursor names:
alias
all-scroll
auto
cell
context-menu
col-resize
copy
crosshair
default
e-resize
ew-resize
grab
grabbing
help
move
n-resize
ne-resize
nesw-resize
ns-resize
nw-resize
nwse-resize
no-drop
none
not-allowed
pointer
progress
row-resize
s-resize
se-resize
sw-resize
text
url
w-resize
wait
zoom-in
zoom-out
This is how they should be implemented
html, body {
cursor: url(images/minired/ayes/purp.cur), default;
cursor: url(images/minired/ayes/help.png), help;
cursor: url(images/minired/ayes/move.gif), move;
cursor: url(images/minired/ayes/text.jpg), text;
}
SOURCE: Here is a link to a working DEMO.
