- JavaScript
- 2013-09-06
この記事は最終更新日から1年以上経過しています。
現在のページのトップへスクロールする小技です。
jQueryを使って実装します。
JavaScriptライブラリをダウンロード
jQuery
まずheadタグ内でjQueryライブラリを読み込みます。
<script type="text/javascript" src="./lib/jquery-1.7.2.min.js"></script>
bodyタグにIDを付けます
<body id="top">
ID付のdivタグで括ってリンクを作成します。
<div id="to_pagetop"> <a href="#top">上に戻る</a> </div>
最後に任意の場所に以下のコードを記述します。
<script type="text/javascript"> <!--// $(function(){ $("#to_pagetop a").click(function(){ $('html,body').animate({ scrollTop: $($(this).attr("href")).offset().top }, 'slow', 'swing'); return false; }) }); //--> </script>
1,321 views