ludic/ease-elastic.html
2026-09-17 22:10:03 +00:00

32 lines
No EOL
2 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Ease.elastic — Ludic</title>
<meta name="description" content="Ease out with a springy wobble.">
<link rel="stylesheet" href="base.css">
<link rel="stylesheet" href="docs.css">
</head>
<body>
<header class="nav"><div class="wrap nav-in"><a class="brand" href="index.html"><span class="logo">L</span> Ludic</a><button class="nav-toggle" aria-label="Toggle menu" aria-expanded="false">☰</button><nav class="nav-links"><a href="index.html">Home</a><a href="api.html">API Reference</a><a class="nav-cta" href="https://git.workshopsoft.io/workshopsoft/ludic">Source ↗</a></nav></div></header>
<main class="wrap item">
<div class="crumbs"><a href="api.html">API Reference</a> <span>›</span> <a href="ns-ease.html">Ease</a> <span>›</span> <span class="here">Ease.elastic</span></div>
<div class="item-head">
<span class="kind-badge kind-method">method</span>
<h1 id="top">Ease.elastic</h1>
</div>
<code class="sig">Ease.elastic(t) -&gt; fixed</code>
<div class="desc"><p>Returns an ease-out that shoots past <code>1.0</code> and wobbles around it a few times with shrinking amplitude before settling — a spring released under tension. The overshoot comes from a decaying <code>2<sup>-10t</sup></code> envelope on a sine, all in Q16.16, so it is deterministic and bit-identical on every platform. Great for UI that snaps in with personality: a panel that springs open, a picked-up item that jiggles, a selection that bounces to place.</p></div>
<div class="examples"><h2>Example</h2><pre data-lang="ludic">program Demo {
handler Step phase Update {
let scale = Math.lerp(0.0, 1.0, Ease.elastic(progress))
}
}</pre></div>
<a class="back" href="api.html">← All symbols</a>
</main>
<script src="ludic-highlight.js"></script>
<script>Ludic.highlightAll(); Ludic.installCards(); Ludic.flashTarget();</script>
</body></html>