Mouse cursors

lightningrock

Easy! Use the cursor property in css like this:


.custom-cursor {
    cursor: url(cursor.png);
}
/* Or */
.custom-cursor {
    cursor: help; /* Change help to anything else */
}

@lightningrock where's the html? I would like that too

lightningrock

Thats css! You just add a css link by doing this:


<link rel="stylesheet" href="style.css"> <!-- Change style.css to the css file -->

@DSAEvan

@lightningrock what about defining a class part?

lightningrock


<your-element class="custom-cursor">Lorem ipsum</your-element>

@DSAEvan

@lightningrock can you make an actual repl

@lightningrock NVM

Google has a lot of things on this i looked it for you.

Hope it helped!

Easy! Go to https://cursor.cc and customize away!

Anyways, can you guess what this does?


body {
  cursor: pointer;
}

@Coder100 make the cursor a pointer ... P.S. https://cursor.cc is giving me a bug... can you give me a tutorial on how to customize and get the custom cursor?

you could just use any image in general @DSAEvan

anyway what part of cursor.cc isn't working? https://www.cursor.cc/ @DSAEvan

@Coder100 When I download it, it opens a file, then closes it on my chrome tab and it does it forever. I need to force close everything to get it to stop

@DSAEvan oh, so a chrome bug :(

@Coder100 So how am I supposed to do a custom cursor? You try...

@DSAEvan too many "..."s

@Coder100 how do you use an image in general?