Simple text animator: splits strings text into single chars and applies animations to each one when the cursor passes over them.
$ npm i -S char-animation
To use, you'll need to import charAnimation
into your js file.
import charAnimation from './node_modules/char-animation/dist/char-animation.js';
charAnimation({selector, animation, color, stroke});
The function receive an object with the follow parameters:
Param | Type | Description | Default |
---|---|---|---|
selector | string | Valid CSS selector: class | id | tag element which the animation will be applied |
Required |
animation | string | Options: rubberBand | bounce | pulse | tada | swing |
Required |
color | string | Color format: #hex | rgb | rgba | hsl | hsla changes the font color when the cursor passes over the chars |
Optional |
stroke | string | Color format: #hex | rgb | rgba | hsl | hsla changes the stroke color when the cursor passes over the chars |
Optional |
charAnimation(
{
selector: "h1",
animation: "rubberBand",
color: "green",
stroke: "blue"
}
);
MIT
All notable changes to this project will be documented in this file.
The format is based on Keep a Changelog, and this project adheres to Semantic Versioning.
- checkers for selector and style declaration
- font-size set to inherit for singleChar elements
- fix critical vulnerability on minist node module