Ease

Category

Animation

Last Changed

1月7日7时48分

Related

animation

easing-function

The code defines easing functions that are commonly used in animations to create smooth transitions. The main function cubicBezier calculates the y-value for a given x-value using cubic Bezier curves. Predefined easing functions like ease, easeIn, easeOut, and easeInOut are provided for convenience.

Demo

source

linear

ease

easeIn

easeOut

easeInOut

Usage

import { Animation, ease } from 'comuse-shared'

const animations = new Animation({
  object: el.value.style,
  property: 'transform',
  startValue: 0,
  endValue: 500,
  duration: 2000,
  easing: ease,
  template: v => `translateX(${v}px)`,
})

Source

Source • Demo • Docs

Changelog

v3.0.0 on 1/7/2025

825ca - feat: shared add functions animation, ease, gesture