How to add Cursor in Website using css?

4.2k Views Asked by Cruz Dusk At 10 April 2025 at 18:25

I want to add Custom set of cursor on my website. How can i add a set of Cursors in Website using css/html/js ? So , Default mouse pointer is different, when i hover hyperlink its diff,,.. n so on. I need help with css code. I have the Set of Pointers including both .ani & .cur required for my site. I have already tried :-

These codes in my style.css

body, a:hover {cursor: url(cursor/blue.cur), progress !important;}

Still no luck ! I have a master page and what I want is to assign a default custom cursor to the page and have all links use another custom cursor

Is this possible?

Original Q&A

There are 2 best solutions below

pirobtumen On 06 August 2014 at 14:36

With css you can do that:

body {cursor: URL(imageFileUrl);}

If you need more information read this.

EDIT: This worked for me: <body style="cursor: url('cursor.jpg'), default">

The imagen that I've used is a jpg 32x32.

CroaToa On 06 August 2014 at 14:40

<script>
document.getElementsByTagName("body")[0].style.cursor = "url('cursor/blue.cur'), auto";
</script>

this must work IE 6+

How to add Cursor in Website using css?

There are 2 best solutions below

Related Questions in HTML

Related Questions in CSS

Related Questions in CURSOR

Related Questions in STYLESHEET

Related Questions in CUSTOM-CURSOR

Trending Questions

Popular # Hahtags

Popular Questions