CODEWITHSUNDEEP
javascripthtmlcss
xX Azezel Xx
xX Azezel Xx

Reputation: 59

How to change cursor depending on element

I created a static website and I have my own custom cursor set I want to implement.

Default would be cursor:url('*filepath*/normal.cur');

then for text cursor:url('*filepath*/textselect.cur');

and for links cursor:url('*filepath*/links.cur');

while loading cursor:url('*filepath*/loading.ani');

how do I implement this properly to work?

Upvotes: 1

Views: 74

Answers (2)

ATIQ UR REHMAN
ATIQ UR REHMAN

Reputation: 448

you give all tages different ids and then add curser property on each element by using hover property

<a id="loading">Loading</a>
#loading {cursor: -webkit-grab; cursor: grab;}

Upvotes: 0

Kevin Hernandez
Kevin Hernandez

Reputation: 1400

Give the element that you want the cursor changed a class and set the :hover property on it and change the cursor accordingly:

ex

.div2:hover{
  cursor: url('http://www.rw-designer.com/cursor-view/126124.png'), auto;
}

Working codepen

Upvotes: 2

Related Questions