v4.3.3
-
Refresh
- Function-based "from" values now refresh correctly when calling
.refresh() - Unit conversion (e.g.,
svhtorem) is recalculated on refresh
- Function-based "from" values now refresh correctly when calling
-
onScroll
- Add
onResizecallback that triggers when the scroll container refreshes due to a resize event
- Add
-
Playback
- Add missing
tl.backward/anim.backward/time.backwardproperty doc
- Add missing
-
Easing
- Add an opacity animation preview to the easing functions editor
v4.3.0
- AutoLayout
- New
createLayout()method to easily animate between two layout states (learn more about layouts here: https://animejs.com/documentation/layout)
- New
- Easings
- The
easeparameter now accepts function-based values (likedurationanddelayproperties)
- The
- Timeline
- Add
compositionparameter to disable animation composition when using.add()and greatly improve performance
- Add
- JS Animation
- Fix an issue where complex values containing a color (e.g.,
box-shadow) would be incorrectly handled as color values instead of complex string values
- Fix an issue where complex values containing a color (e.g.,
- WAAPI
- Fix animations not being properly removed from
document.timelinein some cases
- Fix animations not being properly removed from
- Draggable
- Fix spring parameters not properly setting the duration
- Timeline
- Fix spring easing being ignored when defined in the
defaultsparameter - Fix
.call()and.sync()incorrectly inheritingdelayfromdefaultsparameters
- Fix spring easing being ignored when defined in the
- splitText
- Fix a bug where the first word of the second line could be incorrectly added to the first line
- Fix unnecessary empty spaces not being properly removed from lines
- Engine
- Increase max fps to 240 (previously 120)
- Animation / Timer / Timeline
- Add
muteCallbacksparameter to.complete(muteCallbacks)to complete the animation without triggering callbacks
v4.2.1
- SVG
createMotionPath(): Add an offset parameter (#1037) (@TheHyrox)
- Draggable
createDraggable(): Add adragThresholdparameter to Draggable (#1091) (@craig-jennings)
- Timer, Animation, Timeline
.reset(softReset): ThesoftResetparameter type is now aBooleaninstead of an int
- Draggable
createDraggable(): The drag threshold is now 3px with a mouse and 7px with touch instead of 3px everywhere
- onScroll
- Fix wrong target offsets calculation when container is scaled (#1098) (@sxnb)
- Types
- Fix await
animate()throwing Typescript error (#1043)
- Fix await
- Every demos can now be edited on CodePen
v4.2.0
Looking at the structure of the second file, I'll reformat the first file to match that cleaner format:
- Utils
- Remove
interpolate()(use the simplifiedlerp()instead) - Remove the clock parameter from
lerp()(use the framerate dependent damping functiondamp()instead) - Setting a CSS variable using
utils.set()now computes the variable value instead of setting the var name. To set the variable name without conversion, use a function-based value (x: () => var(--value)) or use the nativeelement.style.setProperty('--value')
- Remove
- Easings
linear(),irregular(),steps()andcubicBezier()have been removed from the core and must be imported separately
- API
- All modules can now be imported individually with subpaths:
import { animate } from 'animejs/animation';
import { createTimer } from 'animejs/timer';
import { createTimeline } from 'animejs/timeline';
import { createAnimatable } from 'animejs/animatable';
import { createDraggable } from 'animejs/draggable';
import { createScope } from 'animejs/scope';
import { engine } from 'animejs/engine';
import * as events from 'animejs/events';
import * as easings from 'animejs/easings';
import * as utils from 'animejs/utils';
import * as svg from 'animejs/svg';
import * as text from 'animejs/text';
import * as waapi from 'animejs/waapi';
- Spring
- Add
bounceparameter to control the strength of the spring - Add
durationparameter to define the perceived duration of the spring - Add
onCompletecallback called when the spring currentTime hits the perceived duration - Support for over-damped springs with stiffness values below 30 (previously these values had no effect)
- Add
- WAAPI
waapi.animate()built-in eases are now on par with the JSanimate()method, plus all native WAAPI easing parameters- Add
persistparameter to control whether the animation should be canceled on finish
- JS Animation
- Add support for CSS variable values (e.g.,
animate(target, { x: 'var(--x, 100px)' }))
- Add support for CSS variable values (e.g.,
- Utils
- Add
createSeededRandom()to generate pre-seeded pseudo-random utility functions
- Add
- Docs
- Add an easing functions editor
- Draggable
- Allow touch dragging within Shadow DOM (#1067)
- Fix draggable getting stuck while dragging near the origin of the initial grab
- Animation
- Fix
animation.revert()not properly reverting multi-target animations styles when targets have different starting style values - Fix inline styles with hyphens (e.g.,
border-radius,stroke-width) not being properly reverted
- Fix
- WAAPI
- Fix
animation.cancel()not properly committing styles before canceling - Fix
animation.revert()not properly reverting multi-target animation styles and not overriding newly added styles - Fix scroll-controlled WAAPI animations being disconnected after completing once
- Fix staggered animations with
reversed: truenot updating on play
- Fix
- Timeline
- Fix
tl.call()not being fired in some cases (#1088)
- Fix
- Utils
stagger()has been moved to/utilsbut still available globally viaimport { stagger } from 'animejs'
- WAAPI
waapi.convertEase()values are now rounded to 4 decimals (previously no rounding)
- Spring
massminimum value is now clamped to 1stiffnessminimum allowed value is now 0dampingminimum allowed value is now 0
- Easings
Ease Backdefault overshoot value is now 1.7 (previously 1.70158)
- Types
- Add
@types/nodedependency for type checking (#1069)
- Add
- Build
- Simplify build scripts:
build,dev,dev:test,test:browser,test:node,open:examples
- Simplify build scripts:
- Text
text.split()deprecated, usesplitText()ortext.splitText()instead
- Spring
createSpring()deprecated, usespring()instead