[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
コメント投稿フォーム