私はHTML5ゲームを構築していて、特定のイベントの特定のコントロールの上にマウスカーソルを置いて、特定の方向に移動しても常に同じ結果が得られるようにしています。これは可能ですか?
私はHTML5ゲームを構築していて、特定のイベントの特定のコントロールの上にマウスカーソルを置いて、特定の方向に移動しても常に同じ結果が得られるようにしています。これは可能ですか?
回答:
したがって、これは古いトピックであることはわかっていますが、最初は不可能だと言います。現在最も近いのは、マウスを単一の位置にロックし、xとyの変化を追跡することです。このコンセプトは、ChromeとFirefoxに採用されています。これは、マウスロックと呼ばれるものによって管理されており、エスケープを押すと壊れます。私から簡単に読みアップ、私はアイデアは、それが一つの場所にマウスをロックし、イベントアンドドラッグクリックに似たモーションイベントをレポートしていることだと思います。
リリースドキュメントは次のとおりです
。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/
JavaScriptでマウスポインタを動かすことはできません。
可能であれば、1秒の影響について考えてください;)
単純なhttp呼び出し、AJAXなどを介してCGIスクリプトとして実行します。たとえば、マウスを移動する座標を指定します。
http://localhost:9876/cgi/mousemover?x=200&y=450
PS:どんな問題についても、何故、どのように、そして何ができないのか、何ができないのか、何百もの言い訳があります。しかし、この無限の宇宙では、それは本当に決断の問題です。それを実現します。
実際の(システム)マウスカーソルを使用しなかった場合は、画面の特定の領域にマウスカーソルを配置できると思います。
たとえば、カーソルの代わりに機能する画像を作成し、シーンへのマウス入力を検出したときにシステムカーソルのスタイルを「なし」に設定するイベントを処理できます(sceneElement.style.cursor = 'none'
)にし、非表示の画像要素が機能するようにします。事前定義された軸/境界ボックスの移動に基づいて、シーン内のどこにでも配置できるカーソルとして。
この方法では、実際のカーソルをどのように移動しても、変換方法によって、必要な場所に画像カーソルが保持されます。
すばらしい質問です。これは、JavaScriptブラウザAPIに欠けているものです。私もチームとWebGLゲームに取り組んでおり、この機能が必要です。マウスのロックを可能にするAPIの可能性について話し合うことができるように、Firefoxのバグジラに関する問題を開きました。これは、そこにいるすべてのHTML5 / WebGLゲーム開発者に役立ちます。
必要に応じて、こちらに来て、フィードバックとともにコメントを残し、問題に賛成票を投じます。
https://bugzilla.mozilla.org/show_bug.cgi?id=630979
ありがとう!
マウスポインターの位置を検出し、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'
});
});
document.getElementByID('thingtoclick').click();
マウスを動かすことはできませんが、ロックすることはできます。注:クリックイベントで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
JavaScriptを使用してマウスポインターを移動することはできないため、セキュリティ上の理由から明らかです。この効果を実現する最良の方法は、実際にコントロールをマウスポインターの下に置くことです。
これは、マウスポインターの実際の位置を取得し、この補正に基づいてスプライト/シーンマウスのアクションを計算して補正することによって簡単に実行できませんか?
たとえば、マウスポインターを中央下にする必要がありますが、左上にあります。カーソルを非表示にし、シフトしたカーソル画像を使用します。カーソルの動きをシフトし、マウス入力をマッピングして、再配置されたカーソルスプライト(または「コントロール」)のクリックに一致させます。カーソルが実際に希望するポイントに当たった場合は、補正を削除します。
免責事項であり、ゲーム開発者ではありません。