Author: | gaoryrt |
---|---|
Views Total: | 7,345 views |
Official Page: | Go to website |
Last Update: | July 1, 2019 |
License: | MIT |
Preview:

Description:
cursor-dot is a vanilla JavaScript library which creates customizable, interactive cursor effects when hovering over certain elements.
How to use it:
Install and import the library.
# Yarn $ yarn add cursor-dot # NPM $ npm install cursor-dot --save
import curDot from 'cursor-dot'
Initialize the cursor-dot library and you’re ready to go.
const cursor = cursorDot({ // options here })
Apply custom styles to the cursor effect when hovering over different elements.
cursor.over(".element-1", { background: "#fff" }); cursor.over(".element-2", { borderColor: "rgba(255,255,255,.38)" }); cursor.over(".element-3", { scale: 0.5, background: "#fff" });
All default config options.
const cursor = cursorDot({ // diameter in pixels diameter: 80, // border width borderWidth: 1, // border color borderColor: '#fff', // easing easing: 4, // background background: 'transparent' })