WEBページを自動スクロールさせて、画像をゆっくり見たい！

今回の記事は、非プログラマー向けの記事になります。
WEBページを開いた時に、画面を自動スクロールしたい時はありませんか？
例えば写真が一覧で表示されるギャラリーページなど、どこまで続いているのかわからないページでは、手動で一番下までスクロールさせるのが面倒な時ありますよね。

一例として、googleの画像ページで、「本」と検索した後のページとかがそうです。
本 - Google 検索

ブラウザ毎に自動スクロールさせるような便利なプラグインがあるかもしれませんが、ツールを使わずともJavascriptという技術で簡単にスクロールさせる方法があります。
若干プログラムを使うわけですが、ページ内の下部に掲載してあるコードをそのままコピペすればいいだけなので、プログラミングのことがわからない人でも大丈夫です！

今回はGoogle ChromeでYahoo!JAPANのページ(http://www.yahoo.co.jp)をスクロールさせた時を例にしてやってみました。
他のブラウザでもだいたいやり方は同じです。

まず、Chromeでページを開いた時に右クリックをすると、以下の画面が出てきます。
ここで「検証」を選択してください。

すると、画面の下に以下のように出てくるものがあります。

そこで、上記のように「Console」というタブが開かれた状態になっていれば問題ないですが、
もし「Console」が開かれていない場合は、
以下のように「×」の左の「・」が3つ並んでいるボタンを押下し、「Dock Side」で真ん中を選んでください。

あとは以下の文を「Console」の箇所に貼り付け、キーボードの「Enter」ボタンを押せばOKです。

var speed = 1; //時間あたりに移動するpx量です。デフォルトでは1pxにしていますが、自由に変えてください
var interval = 100; //移動する間隔です。デフォルトでは0.1秒おきにしていますが、自由に変えてください
var scrollTop = document.body.scrollTop;
setInterval(function() {
    var scroll = scrollTop + speed;
    window.scrollBy(0, scroll)
},interval);

するとススススス...と、画面が少しずつ下に向かってスクロールしていくことがわかると思います。
speedやintervalの値を変えたりして、色々試してみてください。
スクロールの動きを止めたくなった場合は、以下の一文を入れて「Enter」を押してもらえれば大丈夫です。

clearInterval(scroll);

非常に簡単ですね。
先ほど例に挙げた、googleの画像ページ以外でもどのページでも可能ですので、
色々なページで試して、コーヒーでも飲みながら画面がゆっくりスクロールしていく様子を見てもらえればと思います。

一応非技術者向けの記事としていますが、
もちろんフロントエンジニアがJavascriptを使ってページ内でスクロールの動きを実現したい時、上にあるコードを貼り付ければ実現することができます。