Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to hide or change mouse cursor in new browsers?

I was trying to create a library (plugin) for JavaScript that let users to hide mouse and change the mouse cursor with something else.

It was easy before just in CSS work with cursor, I found some plugins like this, but now I visited this website that changed mouse courser.

Why new browsers (or Operation systems) not supporting to change mouse cursor to a image?

like image 462
Lash Avatar asked Jun 07 '15 10:06

Lash


People also ask

How do I hide my browser cursor?

Approach: First, select the element where cursor element need to hide. Add CSS style cursor:none to the a class. Add the class name (class name of CSS style cursor:none) to the particular element where cursor element to be hide.

How do I switch back to the original cursor?

Step 1: Click on the Search box located in the taskbar. Step 2: Type in "mouse." Step 3: Select Change your mouse settings from the resulting list of options to open the primary mouse settings menu. Step 4: Select Additional mouse options.


1 Answers

You can change the cursor to an image but it must be a specific file type. ie .ico:

.cursor{
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  cursor: url(http://davidwalsh.name/demo/css-custom-cursor.ico), default;
}
<body><div class="cursor"></div></body>

The image was from this website.

like image 160
jaunt Avatar answered Oct 12 '22 23:10

jaunt