2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

webページを自動でスクロールするためのブックマークレット

Posted at

自動でスクロールするブックマークレットを作ってみた

ご飯食べながらWeb小説読むときに便利

結論

  1. 以下の文をブックマークのURLに記載して登録する。
  2. スクロールしたいWebページでブックマークから登録したブックマークを実行する。
  • 開始用
javascript:if(typeof idti!=='undefined'){clearInterval(idti);}idti=setInterval(function(){scrollBy(0,1);},50)
  • 停止用
javascript:if(typeof idti!=='undefined'){clearInterval(idti);}

なにやっているの?

コード整形すると中身がわかりやすい

// 既にidti(id time interval)が定義されていれば、自動スクロール処理が走っているとして
// その処理を停止させる
if(typeof idti!=='undefined'){
    clearInterval(idti);
}

// set interval を使って 50ms ごとに 1 pxcel 下に移動する処理を呼び出す
idti=setInterval(function(){scrollBy(0,1);},50)

なお上の停止処理がないと、2回実行したときに50msごとに実行される処理が2つできるので、
意図した2倍の速度でスクロールされてしまう。

また別々の速度をブックマークを登録しておいてスクロール量を変更したいときに、

  1. 停止用のブックマークレットをブックマークから呼び出し
  2. 別の速度のブックマークレットをブックマークから呼び出し

と2回ブックマークを実行するのではなく1度で停止→実行をしたかったので。

スクロール速度のカスタマイズ

以下の数値を変更する。

  • setInterval の 第2引数(遅延間隔)を変更する。
  • scrollBy の 第2引数(上下方向に何pxcel移動するか)を変更する。

※ pxcel数を大きくしすぎたり、間隔を長くするとカクカクしたスクロールになるので、
setIntervalの値を変更することをおすすめする。

なお筆者は5パターンぐらい作って、webページの文字数に応じて変更させてる。

その他

javascript 4年ぶりぐらいに触ったので、拙いところがあるかもしれませんがご了承下さい。

そもそもclearInterval前に if文で判定する必要なくない?
→ 知らん

なんかAndroid chromeでブックマーク実行したけど動かないんだけど!
→ 上のURLにブックマーク名を入力して実行すると動くよ! 面倒だね!!!

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?