hitode909の日記

趣味はマリンスポーツですの日記です

近くのリンクをクリックするnewmouse.user.js

ブラウザで,リンクとかボタンとかをクリックするときに,マウスカーソルをリンクの上まで持っていくのがめんどうで,困ってた.
なにもないところでクリックしたときは,勝手に近くのクリックできそうな要素をクリックしてくれればよいと思ったので,Greasemonkeyを書いた.
newmouse.user.js — Gist

使い方

Greasemonkeyをインストールすると,旧来のマウスカーソル(旧マウスカーソル)と別に,マウスカーソルがもう一個表示されるようになる(新マウスカーソル).
新マウスカーソルはせわしなく旧マウスカーソルの周りを動きまわって,リンクを見つけると,新マウスカーソルがリンクに張り付いて,クリックできますよ,という感じになる.
旧マウスカーソルが,なにもないところで(具体的には,aや,buttonなど以外の上で)クリックすると,新マウスカーソルが張り付いている要素にフォーカスする.
新マウスカーソルがリンクに張り付いてるとき,旧マウスカーソルをダブルクリックすると,新マウスカーソルのリンク先に移動できる.
Commandキーを押しながらダブルクリックすると,新しいタブで開く.

近くのリンクを探す

elementFromPointを使って,マウスカーソルの周りを探すようにしてみた.探してる様子も分かって,うまくいったと思う.

リンクをダブルクリックで移動

aタグとかにクリックイベントを送ると,イベントリスナは実行されるけど,hrefにページ遷移しなかった.
なので,ページ遷移したいときは,ダブルクリック,という使い方になってしまって,使いにくい.
クリックしたときに,何かイベントリスナが実行されたかどうかを調べて,何も起きなかったときだけページ遷移するようにしたかったけど,よくわからなかった.無念.

いきさつ

第2回関西Emacs勉強会の懇親会で,id:samurai20000さんと,こういうのがほしいと話していて,せっかくだから,2人別々に作ることになった.
なので,id:samurai20000さんも同じようなのを作られてる.
[js] webページ中のリンクをクリックするUIを改善する実験 - Hirameki Inspiration