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

2013.09.14

2015.01.12

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

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

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

jquery.mousewheel.js
jquery.easie.js

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

     

→DEMO

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

KEiSoN★

デジタルハリウッドオンラインスクールで、webデザインの基本を学ぶ。
2007年よりECカート開発会社にてwebディレクター/webデザイナーとして従事。マネージャー職も務める。
2009年1月よりフリーランスのwebディレクター/Webデザイナーとして独立。2015年11月にスカイゴールド株式会社として法人化。
中小企業向けのWebブランディング・デザイン、Wordpressのオリジナルテーマ開発が得意。
国内外の様々な価値観・クリエイティブに接触することで、幅広いクリエイティブや臨機応変にアイデアを提供する。