web-dev-qa-db-ja.com

マウスポインターを特定の位置に移動しますか？

私はHTML5ゲームを作成していますが、特定のイベントの特定のコントロールにマウスカーソルを合わせて、特定の方向に移動しても常に同じ結果になるようにしています。これは可能ですか？

javascriptmouse
115
Dennkster

いい質問ですね。これは、実際にはJavascriptブラウザAPIに欠けているものです。私はチームとWebGLゲームにも取り組んでおり、この機能が必要です。 Firefoxのbugzillaで問題を開いて、マウスロックを許可するAPIの可能性について話し始めることができるようにしました。これは、すべてのHTML5/WebGLゲーム開発者にとって有用です。

必要に応じて、戻ってきてフィードバックとともにコメントを残し、問題に賛成票を投じてください。

https://bugzilla.mozilla.org/show_bug.cgi?id=630979

ありがとう！

64
dionyziz

JavaScriptでマウスポインターを移動することはできません。

可能であれば、ちょっと考えてみてください;）

  1. ユーザーの考え：「このリンクをクリックしたい」
  2. Javascriptはmousecursorを別のリンクに移動します
  3. ユーザーが間違ったリンクをクリックし、Cドライブをフォーマットしてキャンディーを食べるマルウェアを誤ってダウンロードする
169
Martin Jespersen
  1. クライアントマシンで小さなWebサーバーを実行します。小さな100kbのものでも構いません。 Python/Perlスクリプトなど.
  2. コンパイル済みの小さなC マウスを移動できる実行可能ファイル を含めます

  3. 単純なhttp呼び出し、AJAXなどを介してCGIスクリプトとして実行します-マウスを移動する座標を使用して、たとえば：

    http://localhost:9876/cgi/mousemover?x=200&y=450

PS：どんな問題についても、なぜ、どのように、どうやって-できない、すべきでない-という言い訳があります。しかし、この無限の宇宙では、それは本当にただの問題です決意の-あなたがそれを実現するかどうかについて

80
Alex Gray

実際の（システム）マウスカーソルを使用しなかった場合、画面の特定の領域にマウスカーソルを配置することができると思います。

たとえば、カーソルの代わりに動作する画像を作成し、シーンへのmouseenterを検出すると、システムカーソルのスタイルを「なし」（sceneElement.style.cursor = 'none'）に設定してから表示するイベントを処理できます。事前定義された軸/境界ボックスの変換に基づいて、シーン内の好きな場所にカーソルとして機能する非表示の画像要素。

この方法では、実際のカーソルをどのように移動しても、変換メソッドは必要な場所に画像カーソルを保持します。

編集： 画像表現と強制マウス移動を使用したjsFiddleの例

69
Xaxis

マウスポインターの位置を検出してから、Webページを（体の位置を基準にして）移動して、クリックしたいものの上にカーソルを置くことができます。

たとえば、ブラウザコンソールの現在のページにこのコードを貼り付けることができます（その後、更新します）。

var upvote_position = $('#answer-12878316').position();
$('body').mousemove(function (event) {
    $(this).css({
        position: 'relative',
        left: (event.pageX - upvote_position.left - 22) + 'px',
        top: (event.pageY - upvote_position.top - 35) + 'px'
    });        
});
41
Amish G

マウスを移動することはできませんが、ロックすることはできます。注：クリックイベントでrequestPointerLockを呼び出す必要があります。

小さな例：

var canvas = document.getElementById('mycanvas');
canvas.requestPointerLock = canvas.requestPointerLock || canvas.mozRequestPointerLock || canvas.webkitRequestPointerLock;
canvas.requestPointerLock();

ドキュメントと完全なコード例：

https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API

11
Dmitry Bosikov

ですから、これは古いトピックであることは知っていますが、まず不可能だと言います。現在最も近いのは、マウスを単一の位置にロックし、xとyの変化を追跡することです。この概念は-ChromeとFirefoxで採用されています。それは呼ばれるものによって管理されています マウスロック、エスケープを押すと壊れます。私から 簡潔な 読み上げてみると、アイデアはマウスを1つの場所にロックし、クリックアンドドラッグイベントに似たモーションイベントを報告することだと思います。

リリースドキュメントは次のとおりです。
FireFox： https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API
Chrome： http://www.chromium.org/developers/design-documents/mouse-lock

そして、ここにかなりきちんとしたデモがあります： http://media.tojicode.com/q3bsp/

7
Codesmith

JavaScriptを使用してマウスポインターを移動することはできないため、セキュリティ上の理由から明らかです。この効果を実現する最良の方法は、実際にマウスポインターの下にコントロールを配置することです。

4
Sheavi

これは、マウスポインターの実際の位置を取得し、この補正に基づいてスプライト/シーンのマウスアクションを計算して補正することで簡単に実行できませんか？

たとえば、マウスポインターを中央下に配置する必要がありますが、マウスポインターは左上にあります。カーソルを非表示にし、シフトされたカーソル画像を使用します。カーソルの動きをシフトし、マウス入力を再配置されたカーソルスプライト（または「コントロール」）クリックに一致するようにマップします。カーソルが実際に必要なポイントにヒットした場合/その時点で、補正を削除します。

免責事項、ゲーム開発者ではありません。

0
Eric Shoberg