@slidy/easing
v1.0.7
Published
Simple easing functions for inertion scrolling
Downloads
118
Maintainers
Readme
@slidy/easing
Simple easings function for inertion scrolling.
Try the DEMO
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
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.
⚠️ For proper operation minimal
duration: 450
needed.
/** 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;
MJS/CJS module import
<head>
<script type="module">
import * as easing from 'https://unpkg.com/@slidy/easing/dist/index.mjs'; // MJS module
// OR
import * as easing from 'https://unpkg.com/@slidy/easing/dist/index.cjs'; // CJS module
</script>
</head>
IIFE as Window
Object
<head>
<script src="https://unpkg.com/@slidy/easing/dist/index.js"></script>
</head>
<script>
window.onload = () => easing = SlidyEasing.linear()
</script>
As third party module in any frameworks
<!-- Svelte -->
<script>
import { linear } from '@slidy/easing';
<Slidy easing={linear} />
</script>
MIT © Valexr