Create DOM Animations.
npm i animatrix
|
pnpm add animatrix
|
yarn add animatrix
|
# AnimSettings
# Easing
[ number, number, number, number ]
# KeyframeAnimation
{
# animation
# breakTime
# keyframes
# next
# onfinish
}
# KeyframeAnimationDetails
{
# animSettings
# getKeyframes
}
# ManualAnimation
{
# current
# from
# last
# set
# state
# stop
# to
# update
}
# ManualAnimationState
# StepAnimation
{
# current
# from
# set
# state
# t
# to
# update
}
# StepAnimationState
# Easing
{
# Flat
= ...
# Linear
= ...
}
# BezierEasing
(mX1, mY1, mX2, mY2)
# mX1
# mY1
# mX2
# mY2
BezierEasing(mX1, mY1, mX2, mY2) =>
# createKeyframeAnimation
(animSettings, target, getKeyframes, current)
# animSettings
# target
# getKeyframes
()
# current
createKeyframeAnimation(animSettings, target, getKeyframes, current) =>
# createManualAnimation
(anim)
# createStepAnimation
(AnimSettings, anim)
Fork or edit and submit a PR.
All contributions are welcome!
MIT © 2022 stagas