🔠 Scatter Letters

The text is scattered when the mouse passes over it.

No PeerDependency! High performance!

🎥 Youtube Demo : https://www.youtube.com/watch?v=eVliGZLmwks&feature=youtu.be

This project was created with inspiration from watching Interactive Developer Kim Jong-min's YouTube.

Usage

new ScatterLetters(strs[,options])

example

window.onload = () => {
  new ScatterLetters("AIC DB GFJ", {
    sparkLevel: 11,
    comebackSpeed: 1,
    mouseThickness: 15,
    color: "#30e080",
    flyingDotColor: "#e81831",
    blankWidth: 17,
    letterSpacing: 4,
    fontSize: 16,
    top: 310,
    left: 160,
  });
};

Strings can contain up to 30 characters. (Alphabet and space only, converted to upper case)

All options are not required.

| Key | discription | default | | -------------- | ----------------------------------------- | ------- | | sparkLevel | Intensity of the spark that spreads when the mouse passes | 6 | | comebackSpeed | Speed at which points return | 4 | | mouseThickness | Extent to which a point is affected when the mouse passes over it | 12 | | color | Color of immobile dots | "#000000" | | flyingDotColor | Color of the scattered dots. It changes slightly to the basic color. | "#00FF00" | | blankWidth | Blank Width | 10 | | letterSpacing | Letter Spacing | 3 | | fontSize | Font Size | 20 | | top | Margin Top | 0 | | left | Margin Left | 0 |