Setting Custom Pointer in CSS

Question

My aim: To change the default click pointer on a website using CSS.

I have already changed the default pointer but this question is specifically for changing different 'versions' of the cursor.

My current attempt for the pointer is:

cursor: url(images/click.png), pointer;

This worked for the default mouse change (pointer was renamed as auto) but I've yet to find a working solution for the pointer.

Is it plausible or is it simply something not needed and thus, not introduced?

javed · Accepted Answer · 2019-12-12 13:00:07Z

4

Just set cursor style.

 
 a {
        cursor: url("/examples/images/custom.gif"), url("/examples/images/custom.cur"), default;
   }

answered Dec 12, 2019 at 13:00

javed

4164 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Himanshu · Accepted Answer · 2019-12-12 11:26:23Z

1

You can read about the css hover property. and add the cursor to it. For example putting the following code in your styles would make the cursor alias whenever you'd hover over the anchor tag. Let me know if this helps you.

a:hover {
  cursor: alias
}

edited Dec 12, 2019 at 11:26

answered Dec 12, 2019 at 11:03

Himanshu

2742 silver badges7 bronze badges

3 Comments

GhastlyCode Over a year ago

Yes, that would beto change the default cursor for the website. I'm looking to only change the style on the pointer. (E.G when you go to click an element that cursor is styled differently)

Himanshu Over a year ago

@GhastlyCode You can make use of hover for that. Example if you have an anchor tag and you'd want to change the styling for it when the user hover over it you'd do this in your styles. a:hover { background-color: yellow; } But this would change it for all the anchor tag so use some class or id if you want to restrict the impact. Hope this helps. You can also read about css hover property.

GhastlyCode Over a year ago

Yep you're right the worst part is it's something I had done before! Apologies, I'm clearly having an off day. Thank you very much for the clarification though, I'll accept your answer :)

Collectives™ on Stack Overflow

Setting Custom Pointer in CSS

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related