4

Does the browser provide some method of capturing the image of a cursor with js/css?

I want to place the cursor image into a div and move the div around. This way it looks as if the there are two cursors on the screen:

  1. The cursor of the actual user that can reach the complete desktop.
  2. My "div cursor" that I can move around only inside the webpage using javascript and css.

Why? Yes you can confuse your users with this, but I would like to make some sort of tutorial which should learn them how to use the application. To make it more user friendly i'd like to use the user's OS/preferences cursor images instead of using some random cursor image of my own.

So... I don't want to change the cursor but capture it's image.

Dex
  • 704
  • 2
  • 9
  • 22
  • CSS has no idea what your mouse cursor looks like and JavaScript only has access to pointer events (location information, basically), not the pointer itself. I would reconsider your implementation, though, because the reality of today is that most Internet users are using devices that don't have a mouse or cursor to begin with. – jeffjenx May 13 '16 at 15:14
  • Yes that is what I was afraid for as well. I hoped the browser would some how provide access for this. Yes i know, however it is specifically build for desktop as requested by the company. Thank you for your info! – Dex May 13 '16 at 16:19
  • You simply have to disable the mouse pointer and create your own as you described. Look also here: http://stackoverflow.com/questions/1361404/web-browser-hide-mouse-cursor – dec May 14 '16 at 04:43
  • 1
    No this is not wat I asked for. I don't want to replace the existing cursor. I'd like to just simply know what it looks like for the user and make a copy from it. – Dex May 14 '16 at 11:48

0 Answers0