css cursor using data-uri

Question

I\'m trying to use custom png cursor using data uri but the cursor doesn\'t change. I\'ve tested on FF 17 which support png as custom cursor. The same data uri work as a bac

Answer 1

Cursor data-uri's are not supported in IE. IE also doesn't support PNGs as cursors. So the best fallback I could get for this case was the following: (tested on IE, Edge, Chrome, FF, Safari

style.cssText += ";cursor:url('cursors/" + file + ".cur'), auto;"; // For IE
style.cssText += ";cursor:url('cursors/" + file + ".cur') 16 16, auto;"; // For other browsers - this will do nothing in IE

Answer 2

Add , auto after your data url like such:

cursor: url(data:image/png;base64,...), auto;

Not sure why this fixes the problem.