Inverted pointer in CSS3

Question

I have a web application in which I need the cursor to be horizontal in the reverse order (flipped from right to left) when I hover over one element, for example, in Microsoft Word or Notepad ++:

And I did not find it in the list of pointers.

I know I can use this:

#reversedCursor:hover { cursor: url("pointer.png"), pointer; } 

But the cursor location will be in the upper left corner of the image, and I want it in the upper right corner.

I don’t want it to be difficult to implement with changing the positions of elements or other things like this.

To summarize: is it possible to reverse the pointer, or can you set the cursor position somewhere in the cursor image? If so, can you give me an example?

I hope you understand what I need.

Answer 1

You can specify the position of the cursor access point using css3:

 cursor: [ <uri> [ <x> <y> ]? , ]* <system>; 

so in your case something like:

 cursor: url("pointer.png") 25 0, pointer;