2013年9月2日(月)自動スクロールするブックマークレット
見ているページを自動スクロールするブックマークレットを作ってみました。iPhone などでも動きます！
- (2013年9月3日(火) 午前0時54分14秒 更新)
Tweet
ながらブラウズに最適！
友人がこういうのほしいと言っていたので作ってみました。PC では画面をマウスでドラッグすると、ドラッグしたスピードで自動スクロールが始まります（ドラッグの向きはタッチと同じ「ナチュラル」です）。iPhone や Android では画面を指先でなぞります。クリックまたはタップでスクロールが止まります。
- 自動スクロール
- ↑上リンクをブックマークバーにドラッグ＆ドロップするか、右クリックからブックマークに追加してください。もしくは、下記コードをブックマークにコピーします。
- コード
javascript:(function(){var%20a={pageX:function(){return%20self.pageXOffset||document.documentElement.scrollLeft},pageY:function(){return%20self.pageYOffset||document.documentElement.scrollTop},run:function(){t=this;var%20b=("createTouch"%20in%20document&&navigator.userAgent.search(/iphone|ipad|android/i)!=-1)?true:false;if(b){self.addEventListener("touchmove",function(c){c=c||event;if(b&&c.touches){c=c.touches[0]}t.ey=c.clientY},false)}else{self.addEventListener(((typeof%20document.onmousewheel=="undefined")?"DOMMouseScroll":"mousewheel"),function(){if(t.i){clearInterval(t.i)}t.i=null},false)}self.addEventListener(((b)?"touchstart":"mousedown"),function(c){c=c||event;if(b&&c.touches){c=c.touches[0]}if(t.i){clearInterval(t.i)}t.i=null;t.sy=c.clientY;t.st=(new%20Date()).getTime()},false);self.addEventListener(((b)?"touchend":"mouseup"),function(i){var%20f=(b&&i.touches)?t.ey:(i||event).clientY;var%20h=t.sy-f;var%20d=(new%20Date()).getTime()-t.st;if(d<200||(h>-20&&h<20)){t.s=null;t.w=null}else{var%20g=h/d;var%20c=parseInt(d/h);if(c<0){c=-c}t.w=(c>10)?c:10;t.t=t.pageY();t.s=parseInt(g*t.w)||((g>0)?1:-1);if(t.i){clearInterval(t.i)}t.i=setInterval(function(){t.t+=t.s;var%20l=t.t;var%20j=self.innerHeight||document.documentElement.clientHeight;var%20e=document.documentElement.scrollHeight-j;var%20k=true;if(t.s<0){if(l<0){l=0;if(t.t<-j){t.t=e;l=e}else{if(t.pageY()<=l){k=false}}}}else{if(l>e){l=e;if(t.t>e+j){t.t=0;l=0}else{if(t.pageY()>=l){k=false}}}}if(k){self.scrollTo(t.pageX(),l)}},t.w)}},false)}};a.run()})();
iPhone の Safari などでは、iCloud 経由で PC のブックマークと同期するか、次のようにします。
- とりあえずこのページを共有ボタンからブックマーク。
- 上記コードを選択してコピー。もしくはこのリンク→ iPhone コピー用 自動スクロール を長押ししてコピー。
- ブックマークを開いて、追加したブックマークを「編集」。
- 名前を「自動スクロール」などに変更し、URL 欄に上記コードをペースト。上記リンクからコピーした場合は最初の「http://」を削除。
友人がこういう需要はあるんだと力説していましたが、確かに、なにかを食べながら記事を読んだり、楽譜を演奏スピードにあわせてスクロールさせたり、いろいろ使い道はありそうです。自分でも記事を読むのにちょっと使ってみました。案外便利ですね！
iPhone で使っているところ（動画）
で、アイディアを提供してくれた友人が、ブックマークレットをたいそう気に入ってくれて、使用動画を送ってきてくれました(笑)。
ブックマークから「自動スクロール」を選択すると、スワイプの速度に合わせて自動スクロールがはじまることがわかります。上から下へも、下から上へも自動スクロールします。最後までスクロールしたら、ページトップまたはページ下端に戻ります。自動スクロールを止めたいときは軽くタップするだけです。
一度止めてもスワイプで再開できるのが便利です♪
- 関連記事
- 自動スクロール Safari 機能拡張「手ぶら Safari」（ながらブラウズに最適！☆）
- リンクタグを表示する Safari 機能拡張（コンテキストメニューから検索することも可能☆）
- RSS や関連リンクを表示する Safari 機能拡張（Safari6でもRSSを表示できます☆）
コメント
トラックバック
関連記事
更新情報
最近の記事
-
2015年1月13日(火)
-
2014年5月2日(金)
-
2014年5月2日(金)
-
2014年1月22日(水)
-
2014年1月21日(火)
-
2014年1月20日(月)
-
2013年9月4日(水)
-
2013年9月2日(月)
-
2013年6月20日(木)
-
2013年4月26日(金)
凄く求めてました！
小説を読むのに面倒で、自動スクロールが出来るものを求めていました！無料で自動スクロールすることが出来て、とても嬉しいです。
こういうものが作れるのは凄いですね！
スクロール途中でも止めることが出来て、凄く便利です。
友達にもオススメしたいと思います(^-^)
Re:凄く求めてました！
感想ありがとうございます！
自動スクロールブックマークレットがお役に立てましたら光栄です☆
最高です
最高です！開発頑張って行きましょう！
Re:最高です
ありがとうございます！
開発がんばってますので、弊社プロダクトについてもチェックしていただけましたら幸いです！(-ε´･๑)✧
お互いがんばりましょう〜。
どうしたら。。。？
はじめまして北海道函館でアマチュアのシンガーソングライターをしています
昨年末近くに初めiPhoneとiPadを手にしました
で、主にiPadで歌詞とギターコードが見れて、自動スクロール出来るのは無いか探していました
あなた様のが良いように思い、入力し試してみましたが、スクロール出来ません。
見たいページを開き、そこから更にブックマークへ行き、スクロールの項目をクリックしても画面が白くなるだけです
どのようにしたらいいのですか？
また、例えばアプリなどで、好きな言葉や文字、文字の大きさなどを入力し、それが好みの早さでスクロール出来アプリはないでしょうか？
それがあればオリジナル曲にも重宝します
よろしく哀愁お願いします
m(_ _)m
なお、わたくし、PCなどのことは初心者同様で猿にも判るよう説明頂ければ幸いです
失礼しました！
ごめんなさい！失礼しました！
出来ました！
ありがとうございます
しかし、さっきのメッセージの後半の部分考えてもらえませんか？
お願いいたします
m(_ _)m
コメントありがとうございます。僕は iPhone のヘビーユーザーというわけでもないので、ご希望に沿う回答を持ち合わせておりませんが、下記URLが参考になるかもしれません。
iPadのスクロールを自動で行わせるにはジェスチャー機能で設定しよう｜iPad知育アプリで遊ぶ親子のネタ帳
登録したジェスチャーでどんなアプリでも自動スクロールできるそうです。
（僕もよく知りませんし、これ以上の回答は無理ですので追加の質問はご遠慮ください。）
できません
すみません。どうやってもスクロールしません。何が間違ってるんでしょうか。？
Re:できません
見当もつきません。。。
すごいです……!こんな便利な機能がブックマークレットでできるとは思いませんでした。
よく使わせてもらってます。
感謝です
コメントありがとうございます！
短いスクリプトではありますが、せっかく作ったので、たくさんの人に使ってもらえると、僕もうれしいです☆
閲覧が楽♪
縦長のＷｅｂサイト見るときには、マウス使わなくていいので楽ですね。使わせていただきます！ありがとうございます！
Re:閲覧が楽♪
感想ありがとうございます。ページの下まで行くと自動的に次のページが読み込まれるサイトでは特に便利ですね。自分でもよく使います(＾＾)。
望んでいました
iPhoneの画面上で自動スクロールができるのを探し求めていました。他にも方法があるらしいのですが、この方法が一番だと思いました。
設定させるのに多少戸惑いましたが、
Re:望んでいました
コメントありがとうございます。iPhone の Safari はいろいろ制約があるので、ブックマークに登録する手順がちょっとややこしいですね(＾＾；。お役に立てましたら光栄です☆
望んでいました
コメントの続きです。
書いてる途中誤って投稿ボタンを押してしまい文の途中になってしまいました。すみません。
動画をヒントに設定できました。設定の仕方の動画があるともっと良いと思いました。これから使わさせて頂きます。本当にありがとうございました。
画像が大量にあるサイト
画像が大量にあるサイトでは全く言うことを聞いてくれません…
スクロールは出来るけどそこから何にも出来ないです。
クリックしても止まらないし…
ずっとスクロールしっぱなしで、Safariを終了すると直ります。
Qoo10っていうサイトのURL貼っておきます！iPhone6です。
http://www.qoo10.jp/gmkt.inc/Mobile/Goods/Goods.aspx?goodscode=419225175&stcode=411
Re:画像が大量にあるサイト
画像が多いサイトでは画像が読み込まれるたびにスクロール量が増えるなどして処理がおかしくなるのかもしれません。そういうサイトでは使用をお控えいただけましたらと思います。。。
androidで使えますか？
お世話になります
こちらのｴﾝﾄﾘ冒頭に「iPhone や Android では画面を指先でなぞります」とあるのでandroidでも使えるのかと思い、設定してみました。
しかし動く気配がありません。
safari限定という訳ではない…のですよね？
ちなみに使っているﾌﾞﾗｳｻﾞはfree adblocker browserです。
もしこちらの勘違い等ありましたらご指摘いただけると幸いです。
どうぞ宜しくお願い致します。
Re:androidで使えますか？
こんにちは。Android でも使えますが、URL欄やブックマークから JavaScript を動作させることができるブラウザに限られます。もしかするとお使いのブラウザでは、広告をブロックするために、JavaScript の動作に制限が加えられているのかもしれません。Chromeなどでは動くと思います。以上参考になりましたら幸いです。
ありがとうございます！
なるほど。ﾌﾞﾗｳｻﾞの仕様を見てみます。ﾀﾞﾒそうなら別のﾌﾞﾗｳｻﾞを使おうと思います。お忙しい中、ご返答いただきありがとうございました！
教えてください！
速さは一律ですか？
Re:教えてください！
スワイプした速度で一律です。途中で変化はしないです。
どうやんの
どうやってもできないんですけど、どうすればいいんですか。iPad Pro 11インチです。コピペは試してみても無理でした
Re:どうやんの
お使いの環境が手元にないので、できない理由はわからないのですが、フリック操作のように弾くのではなくて、指を画面につけたままゆっくり動かしてみてください。
こんにちは
はじめまして、PCのブラウザ（Vivaldi)でこちらを利用させてもらっています。とても便利な機能で素晴らしいと思います……その上で質問ですが、RSSリーダー系のページでは何故かこの機能が働きません（他のページでは問題なく機能します）何か対策などありましたら是非教えて頂きたいです。よろしくお願いします。
Re:こんにちは
こんにちは。
原因はわかりませんが、JavaScriptの動作が制限されているページでは動かないです。
また、そのページの機能とぶつかってしまい、スクロールを検出できず、動かないこともあります。
あまりお役に立てず申し訳ないです。
お節介ですが低速バージョンも
こんにちは。大変役に立たせて頂いております。
私は超低速でスクロールしたかったので、最後の
{self.scrollTo(t.pageX(),l)}},t.w)}},false)}};a.run()})();
を
{self.scrollTo(t.pageX(),l/10)}},t.w)}},false)}};a.run()})();
に変えて使っております。(Javaは未経験なので、もっとまともなイジり方があるのかも知れませんが、とりあえず動いたので・・・)
今後ともお世話になります!
さっぱり
２までしか理解できませんでした。。