Make a cursor an image

Question

I'm trying to get the cursor to change when I hover over an element but I cannot seem to get it to work.

My code so far:

.more_scrolly{
  cursor: url("images/cross.png"), auto!important;
  height: 36px;
  width: 36px;
}

<a href="#one" class="more_scrolly" >learn more</a>

Possible duplicate of http://stackoverflow.com/questions/18551277/using-external-images-for-css-custom-cursors — Alex Ljamin, Aug 26 '16 at 01:20

score 1 · Answer 1 · answered Aug 25 '16 at 20:30

1

Your syntax is incorrect and you need to provide a fallback in case your provided cursor fails to load.

cursor: url("images/cross.png"), auto;

answered Aug 25 '16 at 20:30

Matt Wisniewski

Okay ive corrected my syntax, saved my work, and refreshed the page. It still dosent work. Ive checked the file location and all that no good – Devon Stewart Aug 25 '16 at 21:15
Could it be the file type – Devon Stewart Aug 25 '16 at 21:25

score 0 · Answer 2 · answered Aug 26 '16 at 06:18

0

.CursorClass {
  cursor:url(http://www.javascriptkit.com/dhtmltutors/cursor-hand.gif), auto;
}

<a href="#" class="CursorClass" >Click Me </a>

answered Aug 26 '16 at 06:18

Lalji Dhameliya

2 Answers2