d

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.

15 St Margarets, NY 10033
(+381) 11 123 4567
ouroffice@aware.com

 

KMF

Custom Cursor In React – custom-react-cursor

react-special-cursor gives you the ability to decorate your cursor not only one shape it lets you change the shape with the different class name that you passed to Component.

How to use it:

1. Install and import the react-special-cursor.

# NPM
$ npm i react-special-cursor
import Cursor from "react-special-cursor";

2. Basic usage.

function App() {
  return (
    <Cursor color="orange">
      <App>...</App>
    </Cursor>
  );
}

3. Available props.

  • children: elements that you want to get the cursor shape usually at the top level
  • hoverClasses: an array of objects that accept 2 properties on the name of the class that you want while hovering having an action an another the style class name that you want to set on dotElement
  • borderClassName: this class name will pass to cursor-border
  • dotClassName: this class name will pass to cursor-dot

Preview:

Download Details:

Author: amirho1

Live Demo: View The Demo

Download Link: Download The Source Code

Official Website: https://github.com/amirho1/react-special-cursor

License: MIT

Credit: Source link

Previous Next
Close
Test Caption
Test Description goes like this