こんにちは、すずしんです。
今日はちょこっとだけJavaScriptのプログラミングをしまして…。
ページの先頭にすぐ移動できるブックマークレット「PageTop」を作ってみました。
そこで、今回の記事ではPageTopについて紹介したいと思います。
やっていることは非常に地味なのですが、少しは便利なのでぜひ使ってみてください。
PageTopとは?
今見ているページの先頭にすぐ戻りたいということは時々ありますよね?
サイトによってはページの先頭に戻るボタンやリンクがある場合があります。
それならまだ良いのですが、そういった機能が無いサイトもあります。
その場合、マウスホイールをぐるぐる回したり、スクロールバーを先頭までスクロールするのってちょっと大変ですよね。
そんな時にこの「PageTop」が役立ちます。
PageTopは、今見ているページの先頭(一番上)にすぐスクロールして移動するブックマークレットです。
ワンクリックでページのどこからでも一瞬でページの先頭に戻ることができます。
非常に地味なのですがその効果はなかなかだと思いますよ。
PageTopについて
PageTopの登録
PageTopをブックマークレットとして使うためには、ブックマークに保存する必要があります。
まず、以下のコードをコピーします。
コード上でダブルクリックすると全選択されますので、後は「Ctrl+C」でコピーできます。
そして、お使いのブラウザのブックマークバー上で右クリック→「ページを追加」を選択します。
ブックマークの編集画面が表示されますので、名前に「PageTop」、URLにさきほどコピーしたコードを貼り付けて保存して下さい。
ブックマークレットの保存場所は、ブックマークバー上か、ブックマークバーに「ブックマークレット」というフォルダを作って、その中に保存しておくと分かりやすくて使いやすいと思います。
javascript:(function(){scrollTo(0, 0);})();
PageTopの使い方
PageTopの使い方は簡単です。
ページの先頭に戻りたいなと思ったらPageTopをクリックします。
すると、ページの先頭に一瞬で戻れます。
PageTopのソースコード
PageTopのソースコードは以下のとおりです。
scrollTo関数で(0, 0)を指定して先頭にスクロールさせているだけです。
見ての通り、コード量もほんの僅かです。
非常に単純ですね!
javascript:(function(){ scrollTo(0, 0); })();
まとめ
今回紹介したブックマークレット「PageTop」を使うと、ページの先頭にすぐ戻ることができます。
今までページの先頭に戻るのにマウスホイールやスクロールバーを使っていた人にとっては、手間が省けるので便利なのではないでしょうか?
縁の下の力持ち的な存在のブックマークレットなので、ぜひ使ってやって下さい。
今回は非常に単純なプログラミングでしたので、あまりプログラミングしたという実感がありませんでしたね。
次はもうちょっと複雑でより実用的なブックマークレットを作ってみたいです。