React-smooth-cursor NPM

react-smooth-cursor

Smooth cursor library

Install

yarn add react-smooth-cursor

npm install react-smooth-cursor

Usage

import React, { Component } from 'react'

import SmoothCursor from 'react-smooth-cursor'
import 'react-smooth-cursor/dist/index.css'

class Example extends Component {
  render() {
    (
    return
    <SmoothCursor
      // Required
      selectors={['antValidCssSelector01','antValidCssSelector02']}
      // Optionals
      fillColor='#e20c6a'
      strokeColor='#000'
      strokeWidth={1}
      cursorRadius={25}
    />
    )
  }
}

// or

const Example = () => {
  return(
  <SmoothCursor
    // Required
    selectors={['antValidCssSelector01','antValidCssSelector02']}
    // Optionals
    fillColor='#e20c6a'
    strokeColor='#000'
    strokeWidth={1}
    cursorRadius={25}
  />
  )
}

General Props

Option	Type	Description	Default
`selectors`	string	Anys valid css selectors list which cursor will be animated on	`undefined`
`shape`	string	Shape of cursor ("circle" or "square")	`circle`
`fillColor`	string	Inside color of cursor	`#fff`
`strokeColor`	string	Border color of cursor	`#000`
`strokeWidth`	number	Border width of cursor	`1`
`smoothness`	number	Smooth movement value of cursor (0 - 1.0)	`0.2`
`endScale`	number	Cursor scale animation to value (1 to infinity)	`4`
`endOpacity`	number	Cursor opacity animation to value (0 - 1.0)	`0.2`