リンクをミドルクリックしたときもページトップへ移動しない方法

このQ&Aのポイント
  • userscriptを使用して、リンクをミドルクリックしたときにページトップへ移動しない方法について教えてください。
  • Greasemonkeyを使用して、リンクのミドルクリックによるページトップへの移動を回避する方法を教えてください。
  • ミドルクリックでリンクを開いた際に、ページトップへの自動スクロールを止めるためのuserscriptの書き方を教えてください。
回答を見る
  • ベストアンサー

userscriptでリンククリック以外で実行

Greasemonkeyでページをミドルクリックするとページトップへ移動するスクリプトを書いたのですが、 リンクをミドルクリックしたときもページトップへ移動してしまいます。 リンクをミドルクリックしてもページトップへ移動しないようにするにはどうすればいいのでしょうか? (function() { document.addEventListener("click", function(event) { if (event.button != 1) return; window.scrollTo(document.documentElement.scrollLeft,0); }, false); })(); 以上です。 よろしくお願い致します。

質問者が選んだベストアンサー

  • ベストアンサー
  • q-ue
  • ベストアンサー率75% (12/16)
回答No.1

こんな感じです。 (function() { document.addEventListener("click", function(event) { if (event.button !== 1) return; if (event.target.localName === 'a') return; window.scrollTo(document.documentElement.scrollLeft,0); }, false); })();

nrtm8150
質問者

お礼

回答ありがとうございます。 望み通りの処理になりました。

その他の回答 (1)

回答No.2

if ('A' === event.target.tagName) return event.preventDefault(); で、どうだろう?

nrtm8150
質問者

お礼

回答ありがとうございます。 すごく勉強になります。 ありがとうございました。

関連するQ&A

  • スクロールでもついてくる、TOPへ戻るリンク

    スクロールしても一緒についてくる、 ページのTOPへ戻るというリンクをつけたいのですが、 IEの環境でうまく動作しません。 (クロムやfirefoxではうまく動きました。) イメージとしては、下記のページにあるようなリンクです。 http://www.tokyometro.jp/index.html 何が原因なのか分からないです。 ■HTMLファイル <!-- /pagetopComp --> <div id="pagetopComp"> <p><a href='#' onclick='backToTop(); return false'><img src="/s/top/images/up.png" alt="ページトップへ" width="36" height="120"/></a></p> </div> <!-- /pagetopComp --> ■CSSファイル #pagetopComp { width:36px; height:120px; position:fixed; bottom:50px; right:0; z-index:999; } * html #pagetopComp { position:absolute; margin-top:expression(0 - parseInt(this.offsetHeight / 2) + (document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px'); margin-left:expression(0 - parseInt(this.offsetWidth / 2) + (document.documentElement && document.documentElement.scrollLeft || document.body.scrollLeft) + 'px'); } どこを修正すべきなのかとか、こういう方法がいいよなど 何でもかまいませんのでご教授ください。 お願いします。

    • ベストアンサー
    • HTML
  • スクロール位置 ページ切り替え前と同じにしたい

    POST送信をしてページが切り替わった時に、切り替え前のスクロール位置にスクロールが来るようにしたいです。 以下のソースでスクロール位置は取得できるようなのですが、切り替え後のページに反映させるにはどうしたらいいでしょうか? function getScrollPosition() { var obj = new Object(); obj.x = document.documentElement.scrollLeft || document.body.scrollLeft; obj.y = document.documentElement.scrollTop || document.body.scrollTop; return obj; }

  • ボタンをクリックして画面遷移させる方法について

    flash初心者です。 cs4でAS3.0を使っています。 ボタンをクリックするとgotoAndPlayでラベルの指定してあるフレームに飛ぶように設定したいのですが、クリックしても全く反応してくれません。 ボタンは「next」と「top」の2つを画像(ボタンシンボル)で作成しています。 アニメーション後にこの2つのボタンが出て、それぞれをクリックすると別のアニメーションに飛ぶという流れを考えています。 記述したAS3.0は下記です。 --------------------------- stop(); var topBtn01:SimpleButton = new SimpleButton(); var nextBtn01:SimpleButton = new SimpleButton(); topBtn01.addEventListener(MouseEvent.CLICK,top01Click); nextBtn01.addEventListener(MouseEvent.CLICK,next01Click); function top01Click(event:MouseEvent):void{ gotoAndPlay("top01"); } function next01Click(event:MouseEvent):void{ gotoAndPlay("next01"); } ----------------------------------- それぞれのボタンにインスタンス名を「topBtn01」「nextBtn01」とつけています。 ちなみに、エラーは何も出ていません。 ただ、変数を定義しているはじめの2~3行目を抜くと下記のエラーが出ていました。 --------------------------- TypeError: Error #1009: null のオブジェクト参照のプロパティまたはメソッドにアクセスすることはできません。 at top_main_fla::MainTimeline/frame251() --------------------------- どうしたら良いか、どなたか教えてください。 よろしくお願いいたします。

    • ベストアンサー
    • Flash
  • greasemonkeyで通知を自動クリックしたい

    http://www.pinterest.com/ こちらのサイトを開いていた際にフォローしている方が新しいピンを追加するとヘッダーに通知ボタンが表示される仕組みになっております。Twitterのサイトでいうところの「N件の新しいツイート」と同じ機能です。 この通知ボタンが表示されたらスクリプトで自動クリックしたいと考えています。 開発ツールでクリックする要素(class)を探し、 <div class="Module NewPinsIndicator" style="display: block;">2 新しいピン<em class="arrows"></em></div> greasemonkey(正確にはgoogle chromeでTampermonkeyを使用してます)で function click(target) { var event = document.createEvent("MouseEvents"); event.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null); target.dispatchEvent(event); } function main(){ var newpin =document.getElementsByClassName('Module NewPinsIndicator'); if(newpin) click(newpin); setTimeout( function() { main(); }, 5000); } main(); このようなスクリプトにしたのですが知識不足のため、このサイトでは動作しませんでした。 Pinterestの新着通知を自動でクリックする方法をよろしければスクリプト込みでご教授いただけないでしょうか。 よろしくお願いいたします。

  • addEventListenerで

    window.addEventListener("load", addEvents, false); function addEvents() {  for (var i = 0; i < 3; i++) {   document.getElementById("hoge" + i).addEventListener("click", function() { check(i) }, false);  } } ---- というコードで、イベントを追加したのですが hoge0をクリック -> check(3)を呼び出し hoge1をクリック -> check(3)を呼び出し hoge2をクリック -> check(3)を呼び出し となってしまいます。つまり、引数にループの最後の数字+1が渡されてしまいます。 どうしたらよいのでしょうか?

  • 外部ページからハッシュタグ(#)のリンクへ正しく飛ばない

    外部のページから、ハッシュタグを加えたURLを指定し 自分のページの指定した箇所を表示させたいのですが、 正しい位置に飛びません。 ・自分のページの指定箇所 <div id="■■■"> ・外部ページのリンク指定 a href="http://○○○○○.jp/#■■■" ちなみに、自分のページは基本indexのみで、 ものすごく長く、 ハッシュタグを使ったjava scriptのページスクロールで 指定箇所を行き来できるようにしています。 <script type="text/javascript"> jQuery.fn.extend({ scrollTo : function(speed, easing) { <!-- hashの取得が出来なければ、処理を中断 --> if(!$(this)[0].hash || $(this)[0].hash == "#") { return false; } return this.each(function() { var targetOffset = $($(this)[0].hash).offset().top; $('html,body').animate({scrollTop: targetOffset}, speed, easing); }); } }); $(document).ready(function(){ $('a[href*=#]').click(function() { $(this).scrollTo(1200); return false; }); }); </script> これが原因なのかわかりませんが、 現状、外部からリンクした場合は、 ページ上部の<div id="□□□">には正しく飛びますが、 何故か、ページ下部の<div id="■■■">になると すべてページ最下部に飛ばされてしまいます。 原因分かる方、いらっしゃいませんでしょうか。。

  • AS3.0です。外部ページへのリンク貼り

    ActionScript3.0です。クリックした時外部のページへリンクさせる方法がうまくいきません。 CLICKイベントで、本などで参考にした通りに、Webページへリンクを張るスクリプトを書きましたが、プレビューして見たとき、クリックしても何の反応もありません。 普通ならば、プレビューした時にちゃんとWebページ表示されますよね・・・? (初心者なもので、よくわかっておらずすみません。) スクリプトに関するエラーは出ていません。他は(マウスオーバーなど)うまく反応しています。 スクリプトが問題ではないんでしょうか・・・。わけがわからず困っています。 以下、一応スクリプトです。 image.addEventListener(MouseEvent.CLICK,gourl); function gourl(event:MouseEvent){ var url:URLRequest = new URLRequest("http://ページのアドレス"); navigateTOURL(url); } どなたかわかる方がいらっしゃいましたら、教えていただきたいです。 よろしくお願いいたします。

    • ベストアンサー
    • Flash
  • グローバル変数以外も変数は残り続ける?

    https://okwave.jp/qa/q9323518.html の続き var stoppingNow = false; がグローバル変数になっていないので仕様上はページ読み込み時に実行されて処理が終わった瞬間に この変数は削除されて使えなくなると聞いたのですが、 なぜかpauseBtnを押した後に、playBtnを押すと問題なく使えてしまいます。 グローバルにない変数は、stoppingNow = true;を実行してもそんな変数もうないとなるはずなのですよね? それともグローバルにない変数も残っていて、代入の処理よりも上、ないしは親のスコープにあれば使えるのが仕様なのですか? (function () { var stoppingNow = false; var pauseBtn = document.getElementById('js-pause-btn'); pauseBtn.addEventListener('click', function () { clearTimeout(it); stoppingNow = true; }); var playBtn = document.getElementById('js-play-btn'); playBtn.addEventListener('click', function () { if (stoppingNow === true) { iterative(); stoppingNow = false; } }); } myChange(); })();

  • フラッシュのマウスイベント

    フラッシュのマウスイベントがうまくいかないので教えてください。 ボタンはい列(5個)をしてそれぞれにインスタンスを付けました。 ロールオーバーで背景画像の入れ替えクリックで特定のURLへ飛びたいのですが 飛ぶことはできてもロールオーバーの記述がうまくいきません どう書けばいいのか教えてください 素人で説明見ながらなのでイフ とかエルスの使い方もよくわかりません。 ちなみに下記はクリックしたら出てきた記述で思い通りに動いています。 できたら出てくる画像がフェードインにしたいです 同じタイムラインに画像を配置してそれぞれMC-1とか名前も付けましたが 記述を探しても全くわかりません よろしくお願いします URL1.addEventListener(MouseEvent.CLICK,fl_ClickToGoToWebPage_5); function fl_ClickToGoToWebPage_5(event:MouseEvent):void { navigateToURL(new URLRequest("http://www.○○"), "_blank"); } /* クリックして Web ページに移動 */ URL2.addEventListener(MouseEvent.CLICK,fl_ClickToGoToWebPage_6); function fl_ClickToGoToWebPage_6(event:MouseEvent):void { navigateToURL(new URLRequest("http://www.○○"), "_blank"); } /* クリックして Web ページに移動 */ URL3.addEventListener(MouseEvent.CLICK, fl_ClickToGoToWebPage_7); function fl_ClickToGoToWebPage_7(event:MouseEvent):void { navigateToURL(new URLRequest("http://www.○○"), "_blank"); } /* クリックして Web ページに移動 */ URL4.addEventListener(MouseEvent.CLICK, fl_ClickToGoToWebPage_8); function fl_ClickToGoToWebPage_8(event:MouseEvent):void { navigateToURL(new URLRequest("http://www.○○"), "_blank"); } /* クリックして Web ページに移動 */ URL5.addEventListener(MouseEvent.CLICK, fl_ClickToGoToWebPage_9); function fl_ClickToGoToWebPage_9(event:MouseEvent):void { navigateToURL(new URLRequest("http://www.○○"), "_blank"); }

  • リンクをクリック出来ない。

    http://www.1sshindo.com/ このページを作ったのですが、topページで その他のページというリンクにカーソルを合わせても 指のマークが出ません。 (MACでですが。 windowsを持っていません。) なぜでしょうか。 この要素をtable_top7と指定して cssで.table_top7 { border: thin solid #FF6600; position: absolute; width: 70px; top: 1705px; left: 70px; margin: 1px; } となっていますが、 要素を下に移動させたかったので top:1615px; から top: 1705px; としたらこのようになってしまいました。 1680pxぐらいまでならリンクが出るようです。 なぜでしょうか。 他の要素が影響しているんでしょうか。 初歩的すぎて 怒られそうですが。 お願い致します。

    • ベストアンサー
    • HTML