将鼠标指针移动到特定位置？

Question

我正在构建一个HTML5游戏，我试图将鼠标光标放在特定事件的某个控件上，以便在特定方向上移动始终具有相同的结果。这可能吗？

Answer 1

您无法使用javascript移动鼠标指针。

如果可以的话，只考虑一秒的含义;）

1. 用户认为：“嘿，我想点击此链接”
2. Javascript将mousecursor移动到另一个链接
3. 用户点击错误的链接，无意中下载了格式化他的驱动器并吃掉糖果的恶意软件

Answer 2

1. 在客户端计算机上运行小型Web服务器。可以是一个小的100kb的东西。 Python / Perl脚本等
2. 包含一个小型的预编译C executable that can move the mouse.

3. 通过简单的http调用AJAX运行它作为CGI脚本 - 用你想要移动鼠标的坐标，例如：

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

PS：对于任何问题，有数以百计的借口，为什么，以及如何 - 它不能，也不应该 - 做。但在这个无限的宇宙中，它只是一个问题决定 - 你是否会实现它。

Answer 3

我想如果你没有使用真实（系统）鼠标光标，你可以完成将鼠标光标放到屏幕的给定区域。

例如，你可以创建一个代替光标的图像，处理一个事件，当检测到mouseenter进入你的场景时，将系统光标上的样式设置为'none'（sceneElement.style.cursor = 'none'），然后会根据预定义的轴/边界框平移，在场景中调出一个隐藏的图像元素作为光标。

这种方式无论您如何移动真实光标，您的翻译方法都会将图像光标保留在您需要的任何位置。

编辑：an example in jsFiddle using an image representation and forced mouse movement

Answer 4

好问题。这实际上是Javascript浏览器API中缺少的东西。我也和我的团队一起开展WebGL游戏，我们需要这个功能。我在Firefox的bugzilla上打开了一个问题，以便我们可以开始讨论使用API​​来允许鼠标锁定的可能性。这对所有HTML5 / WebGL游戏开发者都很有用。

如果您愿意，请过来发表评论，并提出反馈，并提出问题：

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

谢谢！

Answer 5

您可以检测鼠标指针的位置，然后移动网页（相对于身体位置），使它们悬停在您希望它们点击的位置上。

例如，您可以将此代码粘贴到浏览器控制台的当前页面上（之后再刷新）

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'
    });        
});

Answer 6

您无法移动鼠标但可以将其锁定。 注意：您必须在点击事件中调用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

Answer 7

所以，我知道这是一个古老的话题，但我首先说这是不可能的。目前最接近的是将鼠标锁定到一个位置，并跟踪其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/

Answer 8

您无法使用javascript移动鼠标指针，因此出于明显的安全原因。实现此效果的最佳方法是将控件实际放在鼠标指针下。

Answer 9

有趣。由于先前提到的原因（垃圾邮件点击和恶意软件注入），这是不可能直接实现的，但是请考虑一下这种骇客，它给人的印象是相同的：

步骤1：隐藏光标

假设您有一个div，可以使用此css属性隐藏真正的光标：

.your_div {
    cursor: none
}

步骤2：引入伪光标

只需创建类似于光标的图像，然后使用position:absolute将其放在您的网页中即可。

第3步：跟踪实际的鼠标移动

这很容易。在互联网上查看如何获取真实的鼠标位置（X和Y坐标）。

第4步：移动伪光标

随着实际光标的移动，将伪光标移动相同的X和Y差。同样，您始终可以使用javascript魔术在网页上的任何位置生成点击事件（只需在互联网上搜索操作方法即可）。

现在，您可以按照所需的方式控制伪指针，您的用户将获得真实光标正在移动的印象。

---

公平警告：：请勿这样做。没有人希望他们的光标或计算机以这种方式控制，除非您有特定的用例，或者确定要逃离用户。

Answer 10

这不能简单地通过获取鼠标指针的实际位置然后根据此补偿计算和补偿精灵/场景鼠标操作来完成吗？

例如，您需要鼠标指针位于底部中心，但它位于左上角;隐藏光标，使用移动的光标图像。移动光标移动并映射鼠标输入以匹配重新定位的光标精灵（或“控制”）点击当/如果界限被击中，重新计算。如果/当光标实际到达您想要的点时，请删除补偿。

免责声明，而非游戏开发者。