マウスホイールでスクロールすると、余韻が残るイージングスクロールJquery

2013.09.14

2015.01.12

通常、ブラウザ上でwebサイトをマウスホイールでスクロールをするとホイールを止めた時にピタッと止まりますが、止まるときに余韻が残ったりするほうが少しリッチな感じがすると思います。jQueryで動作する方法があるので、覚え書き。

プラグインのダウンロード

jqueryのダウンロード・読み込みは基本ですが、その他の必要なプラグインを下記からダウンロードします。

jquery.mousewheel.js
jquery.easie.js

そして、下記のようにJavascriptの記述をします。

     

→DEMO

「var speed = 400;」の数字を変更すると、速度を変更できます。とっても簡単なので、是非試してみてください。

KEiSoN★

インターネット・ITに将来の可能性を感じ、デジタルハリウッドオンラインスクールで、webデザインを学ぶ。
2007年よりECカート開発会社にてwebディレクター/webデザイナーとして従事。マネージャー職も務める。
2009年1月よりフリーランスのwebディレクター/Webデザイナーとして独立し、ノマドな働き方を試み始める。
過去16カ国ほど訪れ、一眼レフにその景色を収めながら時々ドローンも飛ばすなど、写真や映像のクリエイティブにも触れる。
2015年11月にスカイゴールド株式会社として法人化。
中小企業向けのWebブランディング・デザイン、Wordpressのオリジナルテーマ開発・オウンドメディア構築が得意。
国内外の様々な価値観・デザインに接触することで、幅広いクリエイティブや臨機応変にアイデアを提供する。