Getting started

The package is available via [NPM]:

npm i -D @slidy/easing

or from [CDN]:

<script src="https://unpkg.com/@slidy/easing"></script>

Usage Examples

Easing functions available via named import as MJS/CJS module or via global Window.Slidy object props as IIFE.
Includes linear, quad, cubic, quart, quint, bounce, sine, expo, elastic, circ, back as EaseIn functions.
More info: https://easings.net.

/** Easing function.
 * @param t value from 0 to 1
 * @returns value from 0 to 1
 * @default linear
 * @see https://easings.net
 */

type Easing = (t: number) => number;

ES Module import

<head>
   <script type="module">
        import * as easing from "https://unpkg.com/@slidy/easing/dist/index.mjs";
    </script>
</head>

CommonJS Require

<head>
   <script type="module">
        import * as easing from "https://unpkg.com/@slidy/easing/dist/index.cjs";
    </script>
</head>

IIFE as `Window` Object

<head>
    <script src="https://unpkg.com/@slidy/easing"></script>
</head>

<script>
    window.onload = () => {
        easing = Slidy.linear()
    }
</script>

SvelteJS

<script>
    import { linear } from '@slidy/easing';

    <Slidy easing={linear} />
</script>