ページの任意の場所にスクロールできるjQueryプラグイン「AnimateScroll」が面白いですね。バウンスなどのエフェクトを与えることができるので、ちょっと変わったページ内スクロールを実装したい時によさそうです。スクロールが楽しくなるので色んなコンテンツを見てくれそうですね。
[ads_center]
使い方
jQuery本体とダウンロードしたプラグインを読み込みます。
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="animatescroll.js">
あとはスクロールしたい場所とプラグインをセットするだけです。
<div id="sample1">サンプル1<div>
<!-- 中略 --->
<a onclick="$('[id-or-class-of-element]').animatescroll();">サンプル1へ</a>
オプション
オプションは全部で3つあります。
- easing
- scrollSpeed
- padding
実際に使用する場合は以下のように指定します。
$('#sample').animatescroll({scrollSpeed:2000,easing:'easeOutBounce'});
easingには色んなエフェクト効果を指定することができます。エフェクトの一覧は「Easing Function 早見表」から確認することができます。
ランディングページなんかで活用してみたくなりますね。ダウンロードやプラグインの詳細は以下からどうぞ。
