CODEWITHSUNDEEP
htmlcsswebcss-selectorsmouse
Ali Baghban
Ali Baghban

Reputation: 695

make the mouse pointer go underneath an element

This question more probably does not fit in most projects, but as a curiosity:

I know it sounds crazy but is it possible to make the mouse pointer go underneath an element in CSS (or any possible way!)? (Of course z-index does not work in this case. XD)

Or maybe create a pseudo mouse pointer customized for our webpage that in fact simulates the behavior of the user's real mouse pointer. I mean to create a virtual mouse pointer (a DOM element) that is indeed a replacement for the user's mouse pointer in our webpage (the user's mouse is somehow hidden) and our virtual mouse follows the real pointer's movement!

Upvotes: 1

Views: 623

Answers (1)

SymboLinker
SymboLinker

Reputation: 1199

You could hide the pointer on hover (or on your whole page). Define this CSS class and use it in your HTML:

.no-cursor {
  cursor: none;
}

Then your second question, about creating your own mouse pointer: the first thing you need is the location. Then use that location to update the location of the shape you have created in HTML and CSS.

See Javascript - Track mouse position on how to get the location.

Upvotes: 3

Related Questions