Cursor : Invalid property value

7
votes

I've been looking for this for a long time now. All I've found doesn't work for me sadly.

My custom cursor won't work on Firefox, I've a beautiful "Invalid property value". Also in Firefox Developper Edition I've the same error but the cursor is displayed. No problem in Chrome, it's displayed without any error.

There is no problem with my PNG I believe, it's fit all the requierement to be compatible with Firefox.

The code is simple, I don't need to show you more.

body {
  cursor: url('cursor.png'), pointer;
}

And the cursor.png image:

Edit: It's looks like a css rules body:not([id]) is showing up as I inspect element:

This rule is not in my CSS files and I've no idea what it is doing here. Any ideas how to remove it?

Edit 2: Found out that it's NoScript ( add-on ) on Firefox which force this css properties. Can't find a way to remove it though.

2
cssfirefoxmouse-cursor
How do you get the error in Firefox? There's nothing in the console and the cursor works. – Mr Lister
Hello, When I inspect the element : puu.sh/oWHUA/0b4b88ae0d.png The problem is coming from the body:not([id]) which I never wrote it, and I have no single clue why it's here. If you have ideas, pls let me know ! Ps : CSS Files if needed puu.sh/oWIk7/ea1f9614f0.css – Ernoud Dylan
Is the site live yet? I can take a look. – Mr Lister
Hello, I just found that the css properties was foreced by No-Script ( add-on on Firefox ).... It's look like I've found the problem, need to figure how to disable for website now ! – Ernoud Dylan

2 Answers

10
votes

You should add 2 more parameters like this :

cursor:  url(cursor2.png) 2 2, pointer;

please read this mozila guide : https://developer.mozilla.org/en-US/docs/Web/CSS/cursor

4
votes

I had a similar problem. Fixed it by adding "auto" to the end:

cursor: url('cursor.png'), auto;