ぷるるん新感覚!スマフォでのスクロールが楽しくなるナビゲーション -Jelly Navigation Menu

各アイテムをスクロールのスピードに合わせて、ゼリーでできたようにぷるるんと変形させるJelly Navigation Menuを紹介します。

デモのキャプチャ

Introducing Jelly Navigation Menu: When Canvas Meets PaperJS

実際の動作は、下記のデモページで堪能できます。

デモのキャプチャ

デモページ

ぷるるんの量はスクロールのスピードで変化するので、ゆっくりスクロールしたり、素早くスクロールしたりしてみてください。

実装にはPaper.jsTweenJSでぷるるんを再現しており、動作の仕組みは下記デモページで確認できます。

サイトのキャプチャ

デモページ

top of page

©2017 coliss