• ベストアンサー

画面をダブリクリックしたカーソルの位置の取得

WindowsXP上のInternet Exploer 7とSsfariでは取得出来ますが。 WindowsXP上のFirefoxでは取得出来ません。 WindowsXP上のInternet Exploer 7とSsfariの場合。 event.yで取得　下は使用例(画面の上の方をダブリクリック：上にスクロール，画面の下の方をダブリクリック：下にスクロール　の処理をしています) if (event.y <= 200) scrollUp();if (event.y >= yt_k_ww) scrollDown(); WindowsXP上のFirefoxの場合。 http://www.openspc2.org/JavaScript/Ajax/Ajax_study/chapter05/013/sample1/index.htmlにより y = evt.layerY;　によりカーソルの位置の取得 window.alert("evt.clientY!!" + y);　取得内容の表示 を入れても「window.alert」が表示されない 上記の参照ホームページでは、y = evt.layerY;によりサンプルが起動しているようですが。 どのようにすれは、Firefoxの場合のカーソルの位置の取得方法を教えて下さい

  • k0021
  • お礼率89% (33/37)

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

  • ベストアンサー
  • my--
  • ベストアンサー率89% (91/102)
回答No.2

イベントオブジェクトの参照で躓いているようですね。 IEのwindow.eventは楽ですが、Fxの仕様を理解していないとハマります。 提示サイトのソースコードを下記に書き換えるとIEでも動作します。 //document.onmousemove = getMouseXY; var element = document; if (element.addEventListener) { element.addEventListener("mousemove", getMouseXY, false); } else { element.attachEvent("onmousemove", getMouseXY); //IE } attachEventならFxと同様、第一引数でイベントオブジェクトを受け取れます。 「可能ならば」ですが、仕様差異への理解が深まるまでは addEventListener/attachEventで実装し、第一引数でイベントオブジェクトを 受け取るように心がけるとよろしいかと。 document.onclick = hoge; <body onclick="hoge(event)"> このように書かないといけない場合は function hoge(event) { alert(event);//イベントオブジェクト？ if (!event) event = window.event; // IE alert("clientX: " + event.clientX + " clientY: " + event.clientY); } こんな感じでしょうか。

k0021
質問者

お礼

後指摘の内容をアレンジして作成しました。 /* ========================最初に onLoad イベントで初期化する=========== */ rc_ww = getWindowHeight(); // ウィンドウの高の取得 yt_k_ww = rc_ww - 200; // 画面下リック領域の設定 /* __ 画面の上の方をダブリクリック：上にスクロール，画面の下の方をクリック：下にスクロール___ */ window.document.ondblclick = scr_yt_k_ckd; function scr_yt_k_ckd(evt){ if(br_s==0 || br_s==6 || br_s==20){ //IE,Ssfari,Google Chrome の処理 if (event.y <= 200) scrollUp();if (event.y >= yt_k_ww) scrollDown();} else { ay =evt.screenY; if (ay <= 200) scrollUp();if (ay >= yt_k_ww) scrollDown();}} IE,Ssfari,Google Chrome の場合、event.yで処理できたので処理しています。

その他の回答 (1)

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

ぐぐってみればいっぱい出てくると思う。 以下、適当に。（少し古いのも混ざっているかも…） http://archiva.jp/web/javascript/get_mouse-position.html http://www.red.oit-net.jp/tatsuya/java/cursor.htm http://www.openspc2.org/JavaScript/Ajax/Ajax_study/chapter05/013/index.html（質問者様がご提示のサイトかも）

k0021
質問者

お礼

回答有難う御座います。 http://archiva.jp/web/javascript/get_mouse-position.htmlについては知りませんでした。 手抜き申し分けないですがNo2さんの　お礼内容で動きました

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • JavaScriptでマウス位置をリアルタイムで取得

    ウィンドウを開いたら、マウス位置をリアルタイムで取得し、ウィンドウ上に表示ということをしたいのですが、まったくわかりません。 function mousecursor(evt){ //関数の定義 X = event.x; //イベント発生場所のX座標取得 Y = event.y; //イベント発生場所のY座標取得 window.status = X + "," + Y;} //ステータスバーに表示 document.onmousemove = mousecursor; //マウスカーソルが動いたら、関数を呼び出す。（bodyタグで呼び出しも可） というようなソースを手に入れたのでやってみたら、できることはできたんですが、なんとなくしか意味がわかってません。 HTMLやPerl、VBAなどはできるんですが、どうしてもJavaScriptがあんまり理解できないんです…。 リアルタイムで取得し、表示、ということではなくても、自分の任意したように出力させたいんです。 （たとえばどこかをクリックしたらアラート表示など） よろしくお願いします。

  • iアプリでカーソルの位置取得

    今回はじめてiアプリを作成中なのですが、panelクラスで何かのキーが押された時にどの入力項目上にカーソルがあるかを取得したいのですが、やり方がわかりません。どなたか教えて下さい。イベントがあった時にどの項目にあるかがわかるか、それともY軸の座標（項目は縦に並んでいるので）がわかればいいのですが、よろしくお願いします。 PS.出来ればCanvasではなくpanelでの方法を教えて下さい。

  • イベントの関数について、よくわからないことがあります。

    イベントの関数について、よくわからないことがあります。 (1)引数をセットしない関数と window.document.onmousemove = f; function f(evt) { alert(evt); } (2)無名関数？に引数 window.document.onmousemove = function(e) { alert(e); } (1)(2)は同じ動作なのですが、window.document.onmousemoveにセットする関数の引数は 特殊なのでしょうか？

  • ＩＥのイベントでのウインドウ位置の取得

    以前に、MdNの「リンクにマウスオーバーするとポップアップで説明が表示される」というサンプルの記述がうまく動作しないという質問で、FairefoxやSafariではその回答でうまく動作するようなのですが、ＩＥの動作がまだ駄目なようなのです。 ＩＥのイベントが発生した時のマウス座標の取得は、Javascriptで、 function OnScreenHelp(x,y){ if(document.all) { /* IEでの処理 */ document.getElementById(strID).style.left = event.x + document.body.scrollLeft + 15; document.getElementById(strID).style.top = event.y + document.body.scrollTop + 0; }else{ 　　　　　　　　　　　　/* IE以外の処理 */ document.getElementById(strID).style.left = x + 15 + "px"; document.getElementById(strID).style.top = y + 0 + "px"; } } のような記述になっているのですが、関数OnScreenHelp(x,y)のx,yがbodyの本文内で、event.pageX、event.pageYのようにＮＮ系の記述になっているため、ＩＥではこのx,yの値は使えないので上記のような記述になっているようなのです。上記の記述ではうまくポップアップしてくれないので、 event.xやevent.yの所の記述がまずいのかな？と思って、ちょっと調べてみて、window.event.offsetXやwindow.event.offsetYに変更してやってみたのですが、うまくいきません。ここの所の、IEの記述としては、どのように記述したらよいか分かりかねています。ご経験のある方、ご教示願えたらと思います。 よろしくお願い致します。

  • 文字がマウスカーソルを追従するスクリプト

    いつもお世話になっております。 以下のサンプルスクリプトでinnerText・style.left・style.topと書いてあるところがあるのですが、これはどういう意味なのでしょうか？ どなたかわかる方、教えてください。 お願いします。 <HTML> <HEAD> <TITLE>マウスポインタ座標表示</TITLE> <STYLE TYPE="text/css"> <!-- #msxy { position:absolute; top:0px; left:0px; width:48px; color:black; background-color:yellow; font-size:7pt; border-width:1px; border-size:1px; border-style:solid; } --></STYLE> <SCRIPT Language="JavaScript"> <!-- function displayMouseXY(evt) { var X = Y = 0; if (document.all) { X = event.x; Y = event.y; document.all["msxy"].innerText = X+","+Y; document.all["msxy"].style.left= X + 8; document.all["msxy"].style.top = Y + 16; } if (document.layers) { X = evt.x; Y = evt.y; with(document.layers["msxy"]) { document.open(); document.write("<SMALL>"+X+","+Y+"</SMALL>"); document.close(); left = X + 8; top = Y + 16; bgColor = "yellow"; } } } if (document.all) document.onmousemove = displayMouseXY; if (document.layers) { window.onmousemove = displayMouseXY; window.captureEvents(Event.MOUSEMOVE); } // --> </SCRIPT> </HEAD> <BODY BGCOLOR="white"> マウスポインタ座標表示<BR> <DIV ID="msxy"></DIV> </BODY> </HTML>

  • FireFoxでブラウザーと閉じる時に特定の処理を実行したいのですが良い方法を教えてください。

    ブラウザーを閉じる時に特定の処理をWebページ内で実行したのですが、FireFoxでは可能でしょうか? IEでは、下記のロジックで対応することが出来ました。 window.onunload=function() { var x=window.event.clientX,y=window.event.clientY; var w=document.body.clientHeight; if (y<0 &(w-5)<x || x<15) { alert('IEを閉じます。'); } }

  • jqueryを使いajaxで取得したデータをコールバック関数外で取得する方法

    下記のようなスクリプトでjQueryを使い、ajaxでtextを取得します。 コールバック関数内では、もちろんtextが使えるのですが、コールバック関数外からはtextに一切アクセスできなくなります。 このようにグローバルからajaxで取得したデータは取得できないのでしょうか？ prototype.jsでも同じ結果です。 グローバルからの取得法、ご存知の方いらっしゃいましたらご教示頂ければと思います。 <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"><!-- $(document).ready(function (){ $.get("./sample.txt",function(text){ alert(text); // textが取得できる }); }); alert(text); // textが取得できない // --></script>

  • 初心者なのですが教えてください。

    ＨＴＭＬで初めてプログラムを作ってみました。 ある画像があり、カーソルを動かすとｘ、ｙ座標を表示させる プログラムを作りました。 今回これを改良したいのです。 画像の中に、人の絵がありまして、その人のところに カーソルを持っていくと画面にその人の名前が表示されるようにしたいです。 たとえばｘ、ｙの座標、共に（２００、２００）の所に その人物の中心があるとすれば、その前後±５０ぐらいの範囲で この名前が表示されるようにしたいです。 まだまだ未熟で分からないことだらけなので、どなたか分かる方 ご指導ください。ヨロシクお願いします。 <html> <head> <title>情報収集</title> </head> <body> <script type="text/javascript"> window.document.onmousemove = getMouseXY; function getMouseXY(evt){ // x,yとpageX,Y if (window.createPopup){ x = event.x + document.body.scrollLeft; y = event.y + document.body.scrollTop; } else{ x = evt.pageX; y = evt.pageY; } document.getElementById("result1").innerHTML = "(x,y) = "+x + ", "+y; // offsetX,YとlayerX,Y if (document.all){ cx = event.offsetX; cy = event.offsetY; } else{ cx = evt.layerX; cy = evt.layerY; } document.getElementById("result2").innerHTML = "(offsetX,offsetY) = "+cx + ", "+cy; } </script> <IMG src="q600.jpg" name="img1"> <br> <div id="result1"></div> <div id="result2"></div> <script type="text/javascript"> function eve1(e){ window.status="[ 座標位置 ] : "+"( x , y ) = "+"( "+x+" , "+y+" )"; return true; } document.onmousedown = eve1; </script> <script type="text/javascript"> function openWindow1(){ window.open("serv.html","OpenWindow","screenX=20,screenY=50,left=20,top=50,width=160,height=240"); } document.ondblclick=openWindow1(); </script> </body> </html>

    • ベストアンサー
    • HTML
  • 初心者なのですが教えてください。

    ＨＴＭＬの中にJavaScriptを用いて 初めてプログラムを作ってみました。 ある画像があり、カーソルを動かすとｘ、ｙ座標を表示させる プログラムを作りました。 今回これを改良したいのです。 画像の中に、人の絵がありまして、その人のところに カーソルを持っていくと画面にその人の名前が表示されるようにしたいです。 たとえばｘ、ｙの座標、共に（２００、２００）の所に その人物の中心があるとすれば、その前後±５０ぐらいの範囲で この名前が表示されるようにしたいです。 まだまだ未熟で分からないことだらけなので、どなたか分かる方 ご指導ください。ヨロシクお願いします。 <html> <head> <title>情報収集</title> </head> <body> <script type="text/javascript"> window.document.onmousemove = getMouseXY; function getMouseXY(evt){ // x,yとpageX,Y if (window.createPopup){ x = event.x + document.body.scrollLeft; y = event.y + document.body.scrollTop; } else{ x = evt.pageX; y = evt.pageY; } document.getElementById("result1").innerHTML = "(x,y) = "+x + ", "+y; // offsetX,YとlayerX,Y if (document.all){ cx = event.offsetX; cy = event.offsetY; } else{ cx = evt.layerX; cy = evt.layerY; } document.getElementById("result2").innerHTML = "(offsetX,offsetY) = "+cx + ", "+cy; } </script> <IMG src="q600.jpg" name="img1"> <br> <div id="result1"></div> <div id="result2"></div> <script type="text/javascript"> function eve1(e){ window.status="[ 座標位置 ] : "+"( x , y ) = "+"( "+x+" , "+y+" )"; return true; } document.onmousedown = eve1; </script> <script type="text/javascript"> function openWindow1(){ window.open("serv.html","OpenWindow","screenX=20,screenY=50,left=20,top=50,width=160,height=240"); } document.ondblclick=openWindow1(); </script> </body> </html>

  • jQuery IEでctrl + click判別

    jQueryは2.0.0を使用しております。 HTMLのpタグでくくった要素をクリックした際の判別を行いたいと思っております。 以下は参考となりますが、 <p class="button">ボタン</p> 上記のボタンをクリックしたことを取得するため、 $(".button").click(function(event) { alert("アラート"); }); こちらでアラートが表示されるようになりましたが、 crtlキー + クリックしたことを取得したいと思っております。 上記の処理でアラート部分を if (event.ctrlKey){ alert("アラート"); } としますと、Chrome、Firefoxの最新版でアラートが表示されますが、 IEでは表示されません。（私は、IE11、9で確認済みです） IEでもctrl + clickされたことを取得できるようにしたいのですが、 ご教授いただけますと幸いです。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する