Motus

Motusはスクロールに応じて任意の要素にアニメーションを付与する為のライブラリです。非依存なので単体で使えます。アニメーションはCSS keyframesライクな書き方ができますのでCSSの知識がある方なら扱いやすいと思います。
const customStartPointAnimation = new Motus.Animation(
new Motus.Point(document.getElementById('start-point')),
new Motus.Point(document.getElementById('end-point')),
document.getElementById('cube-startend'),
{
50: {
width: '200px',
marginLeft: '100px',
},
100: {
width: '100px',
marginLeft: '200px'
}
}
);
Motus.addAnimation(customStartPointAnimation);
指定した開始ポイントにスクロールが達したら設定したアニメーションが起動します。複雑なアニメーションも割と手軽に実装出来そうです。ライセンスはMIT。
