jQuery plugin: “jquery.bren.scroller”

よくあるページ内リンク(ハッシュ)に移動する、スムーススクロールプラグインです。


機能の特徴は

  • ページ内スムーススクロール
  • ページ読み込み時もスムーススクロール
  • スクロール位置のx,yにオフセットを指定できる
  • jQueryのeasingに対応


上記すべての機能が既存ではなかったので作った・・・ という理由です。


サンプルコードは次の通り

<script type="text/javascript" src="/js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="/js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="/js/jquery.bren.scroller.js"></script>
<script type="text/javascript">
  $(function() {
    $('a[href^=#]').bren_scroller({
      easing	: 'easeOutCirc',
      ofsy	: -100
    });
    $.fn.bren_hashscroller({
      easing	: 'easeOutCirc',
      ofsy	: -100
    });
  });
</script>



引数は次の通り

{
  speed		: 500, // msec
  easing	: null, // jQuery easing
  ofsx		: 0, // x offset
  ofsy		: 0, // y offset
},


ダウンロードはこちらからどうぞ

jquery.bren.scroller


次回公開予定・・・ ボックス要素を矩形内制限するプラグイン(時期未定)