css Question posted in
Some basic documentation can be found here.

Css – Is it possible that cursor changes color when hovering image?

I changed standard cursor to grab. What i would like in addition is that cursor (grab) changes color, not background.

Here is a part from javascript. I manage with "grab" but not with color change. Any advice?

x.addEventListener('mouseover', () => {
    // Change the button's background color
    

    x.style.cursor = "grab";
    
    x.style.Color = "red"


  });
Tags:

2

Answers


  1. 0

    I think that it is possible to make svg images with different colors and connect them with the colors that are needed, an example of connecting svg is at the link.
    MDN Web/CSS/cursor

    body {
      cursor: url('path-to-image.png'), url('path-to-image-2.svg'), url('path-to-image-3.jpeg'), auto;
}
    Login or Signup to reply.
  2. 0

    You can assign a custom image as the cursor when hovering over the button.

    <!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Lipsum</title>
  <style>
    button:hover {
      cursor: url('https://i.sstatic.net/265RWKkM.png'), grab;
    }
  </style>
</head>

<body>
  <button>Foo</button>
</body>

</html>

    Supported image file formats

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search