001 スムーススクロールを実装する

概要

jQueryを使って、画面スクロールボタンを設置してみます。

Dynamic Drive DHTML scripts- jQuery Scroll to Top Controlにアクセスして、scrolltopcontrol.jsをダウンロードします。
同ファイルを「js」フォルダに移動します。
サイトから“up.png”をダウンロードするか、自分で「up.png」を用意して「image」フォルダに移動します。

setting: {startline:100, scrollto: 0, scrollduration:100, fadeduration:[500, 100]},

「skin」フォルダにある「pukiwiki.css.php」を開いて「<head>」タグに以下を追記します。
- <script type=“text/javascript” src=“http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js”></script>
- <script type=“text/javascript” src=“js/scrolltopcontrol.js”></script>

これでブラウザの右下にスクロールボタンが表示されます。