ScrollPress

JavaScript

スムーズなアニメーションのスクロールトップ実装「ScrollPress」

ScrollPressは、スムーズなアニメーションによるスクロールトップを実装することができるjQueryプラグインです。スクロールトップボタンもアニメーションで表示されます。オプションもかなり豊富なので、カスタマイズ性にも優れています。

ScrollPress

デモ

デモでは下へスクロールしていくと、右下にトップへ戻るためのボタンがアニメーションとともに表示されます。ここをクリックするだけで、スムーズなアニメーションで画面上部までスルスルとスクロールされます。

ランディングページや長文記事が多いブログなど、縦長のページにはピッタリの機能ですね。

また、デモでは左側にID1〜ID5までの項目も設置されており、いずれかのIDをクリックするとその場所まで自動でスクロールされます。もちろん、こちらもアニメーション付きでのスクロールになります。

縦長でボリュームのあるページだと、目的の場所を探すのは大変なので、このように自動で目的の場所までスクロールされるメニューはとてもありがたいですね。

ScrollPressにはオプションもたくさん用意されています。scrollPress、duration、easing、btn_state、btn_icon、btn_container、btn_threshold、btn_inlineStyle、btn_style、btn_fadeAnimation、fadeInClassなどなど、他にもいろいろな項目によるセッティングが可能です。

多彩なオプションを利用して、自分好みにカスタマイズして実装したい人にもピッタリの仕様といえます。

というわけで、スムーズなアニメーションによるスクロールトップを実装したい人は、ぜひ「ScrollPress」を活用されてみてはいかがでしょうか。

ScrollPress

NO IMAGEレスポンシブ対応のスタイリッシュなスライドショー実装「offbeatSlider」前のページ

ランダムサイズの画像をかっこいいギャラリーにしてくれる「Flex-box Gallery」次のページFlex-box Gallery

最近の記事

  1. 縦置きスタンド
  2. スマトラ
  3. さくらドーナツ
PAGE TOP