スクロールを制御していい感じのポートフォリオを作ることができるライブラリです
ダウンロード
インポート
<link rel="stylesheet" href="assets/easingscroll/css/easingscroll.css">
<script type="text/javascript" src="assets/jquery/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="assets/easingscroll/js/easingscroll.js"></script>
使い方
body内にpage要素を作りease属性に使いたい動きを指定してください
<page ease="quadratic">
<p>テスト</p>
</page>
デフォルトで使える動き
ease属性 | 解説 |
default | 上から下へ |
quadratic | 下から真ん中 真ん中から下へ |
reverse_quadratic | quadraticの逆 |
cubic | 上から真ん中 真ん中から下へ |
reverse_cubic | cubicの逆 |
下記のサンプルサイトを見たほうが早いと思います