Custom Cursors

cgregory

Recently on two of my sites I've added custom cursors and it was suggested I share the code.

My current pathfinder campaign "Devils and Dilettantes":https://devils-and-dilettantes.obsidianportal.com/ has pentagram cursors that change to a different pentagram when it hovers over a link.

a:hover {cursor: url(http://www.rw-designer.com/cursor-extern.php?id=62168),pointer;}
.campaign-public-layout, .campaign-dashboard-layout {cursor: url(http://www.rw-designer.com/cursor-extern.php?id=62172),auto;}


My work in progress campaign "Deus Ex Machina":https://deusex.obsidianportal.com/ uses more futuristic looking cursors changing when hovering over links (well really any 'a' tag)

a:hover {cursor: url(http://www.rw-designer.com/cursor-extern.php?id=45717),pointer;}
.campaign-public-layout, .campaign-dashboard-layout {cursor: url(http://www.rw-designer.com/cursor-extern.php?id=64537), url(http://www.rw-designer.com/cursor-extern.php?id=64522) ,auto;}

Not all browsers support all filetypes of custom cursors. Firefox dropped support for .ani cursors, and chrome does not support it either. I've found .cur seems to have the widest support (only opera doesn't support it) followed by .gif (IE and opera don't support gif as cursors).

I'm using cursors found at "RW Designers":http://www.rw-designer.com however there are many other sites that provide custom cursor links. If you find some good sites provide some links.

GamingMegaverse

Thanks so much!! Very cool!
killervp
"A God...Rebuilt":https://a-god-rebuilt.obsidianportal.com
"OP's COTM April 2012":http://blog.obsidianportal.com/a-god-rebuilt-aprils-cotm/
Over 300 Fans, and Looking for More!

cgregory

You might like this other ankh cursor for hovering on the non IE browsers since your current one only works for Internet Explorer.

http://www.cursors-4u.com/cursor/2009/04/29/ankh.html

GamingMegaverse

Yep, that is better! Thanks!!

PhoenixMark

Thanks for the code, I love the feel of custom cursors: "Shimmering Kingdoms: FATE":https://shimmering-kingdoms-fate.obsidianportal.com/

"PhoenixMark":http://www.obsidianportal.com/profile/PhoenixMark

"CRIMSON SKIES":http://www.obsidianportal.com/campaigns/crimson-skies
"COTM June 2012":http://blog.obsidianportal.com/crimson-skies-junes-campaign-of-the-month/

Also "Sactown Blues":http://www.obsidianportal.com/campaigns/sactown-blues

cgregory

Glad to have been of help. Great looking site PhoenixMark

Bortas

Well dang, found what I love, but it is only supported by IE. Is there a way to have it display different cursor sets to different browsers?

-bort
"Morwindl":http://morwindl.obsidianportal.com

cgregory

Sort of. Firefox allows for multiple cursors. Not sure that chrome does.

Notice the ", auto" that , is the secondary cursor to try if the first one doesn't work. So instead of auto you could try a second cursor.

{cursor: url(http://www.rw-designer.com/cursor-extern.php?id=62172),auto;}

Bortas

Good stuff, thank you!

-bort
"Morwindl":http://morwindl.obsidianportal.com

Keryth987

OK, silly question. Does this go into the CSS or is it something that needs to be put on every page?

Nevermind. Tried it and it's in the CSS...I feel so silly :)

Keelah Se'lai,
Keryth
"Shadows Over New York":http://www.obsidianportal.com/campaigns/shadows-over-new-york
"2013 Campaign of The Year":http://blog.obsidianportal.com/2013-coty-shadows-over-new-york/