Harrison Reeves
Harrison Reeves

Reputation: 101

How can I use multiple custom cursors for different purposes in CSS?

So, I have multiple cursors (e.g. default and pointer) and want to use them. I know how to implement them using this method:

cursor: url('default.cur'), default;

How can I use my default.cur for only default and my pointer.cur for only pointer? There's most likely a way to do this, but I'm an idiot sometimes.

Upvotes: 1

Views: 291

Answers (1)

Harrison Reeves
Harrison Reeves

Reputation: 101

Simple fix. Use the same method, but with different URLs to different cursors in different tags like so:

body {
    cursor: url('default.cur'), default;
}

a {
    cursor: url('pointer.cur'), pointer;
}

The default cursor will work on the body, and the pointer will work over all the "a" tags.

Upvotes: 1

Related Questions