[JavaScript] SmoothScroll

今更ながら、SmoothScroll のライブラリを作成した。

JSファイルの読み込みのみで実装が可能で、ページ上部へのスクロール、下部へのスクロールの両方に対応している。

使い方

ZIPファイルを解凍後(中身はscroller.js)、任意のディレクトリに配置し、本機能を実装したいhtmlでJSファイルを読み込む。

<script type="text/javascript" src="js/scroller.js"></script>

以上で実装は完了となる。
通常通りアンカーリンクを href="#id" として html を作成すれば、自動的に該当アンカーリンクに scroller.js が有効となる。

仕組み

画面ロード時に javascript によって全ての a 要素を取得し、href 属性が # から始まっている場合は、該当 href 属性の値を javascript の scroll 用関数に置き換える。

// 適用前(通常アンカーリンク)
<a href="#aaa">aaaへのアンカーリンク</a>
// 適用後
<a href="javascript:scroller.main('#aaa');">aaaへのアンカーリンク</a>

JS側設定値を編集することで、指定のアンカーリンクを適用外とすることもできる。

トラックバックURL

http://mashimonator.weblike.jp/mt/mt-tb.cgi/75

コメント投稿フォーム