Search code examples
javascriptjquerycsscursorloading-animation

Change cursor to loading animation

I've got a few loading bars that appear during any postbacks. How can I use CSS to have the cursor change into a custom loading animation? In examples I've come across, I can only turn the cursor into other preset images (such as an hourglass). Is it possible for me to use a custom gif as the cursor? Thanks

Solution

  • See this article: http://beradrian.wordpress.com/2008/01/08/cross-browser-custom-css-cursors/

    The cursor CSS property can take a url() value:

    .my-cursor {
  cursor: url("mysite/cursor.png"), default;
}

    Different browsers have different foibles. I haven't messed with this in years so I'm not sure what you might encounter as to browser support, and of course on mobile devices it's not relevant.