将鼠标指针移到特定位置?


127

我正在构建HTML5游戏,并且尝试将鼠标指针放在特定事件上的某个控件上,以便在特定方向上移动始终具有相同的结果。这可能吗?


如果我理解正确,则想使用JS移动鼠标光标-这是不可能的。您需要找到另一种方式。
2011年

1
HTML5具有一些新的Mouse Events,但没有移动鼠标的功能。您可以始终window.moveBy(x,y); 将窗口移动到鼠标悬停的位置下方。这将是一个非常时髦的游戏:)我看到的唯一通过ActiveX进行的othadox方式是通过ActiveX-ewwww,yuk!
杰里米·汤普森

1
否-JavaScript不允许您这样做,但是我想可能会有一种解决方法,涉及将页面移动到特定位置,也可以使用window scrollTo()来“移动”光标-请参阅w3Schools在w3schools.com/jsref/met_win_scrollto.asp中
星尘号

1
在智能手机上移动鼠标,祝您好运。
心教堂

鼠标指针的图像可以移动并设置cursor:none。这不是安全风险,因为您是程序员。如果您可以制作游戏,也可以避免在玩游戏时点击银行帐户的风险。

Answers:


20

因此,我知道这是一个老话题,但是我首先要说这是不可能的。当前最接近的是将鼠标锁定在单个位置,并跟踪其x和y的变化。这个概念已经被Chrome和Firefox所采用。它由所谓的“ 鼠标锁”管理,点击逃逸将使其中断。通过简短的阅读,我认为其想法是将鼠标锁定在一个位置,并报告类似于单击和拖动事件的运动事件。

这是发行文档:
FireFox:https : //developer.mozilla.org/zh-CN/docs/Web/API/Pointer_Lock_API
Chrome:http : //www.chromium.org/developers/design-documents/mouse-lock

这是一个非常简洁的演示:http : //media.tojicode.com/q3bsp/


我将其作为接受的新答案,因为这正是我所要求的用例,即使并非所有浏览器都支持该用例。
Dennkster

187

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

如果可以的话,请考虑一秒钟的含义;)

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

74
真正的点击劫持。
Blender

15
想一想,这真是太棒了:P
Martin Jespersen

24
嘿,我讨厌为控制鼠标光标而战:支持您的广告,支持我!
Blender

78
网页可以强制下载而无需任何人单击链接,因此您声称的并不是真正的安全问题。但是,无法移出网页窗口。
dionyziz 2011年

11
@dionyziz:强制下载到沙箱和通过用户交互启动用户空间下载之间有很大的不同。安全隐患实际上很大。
马丁·耶斯珀森

88
  1. 在客户端计算机上运行小型Web服务器。可以是一个100kb的小东西。Python / Perl脚本等
  2. 包括一个小的预编译C 可执行文件,它可以移动鼠标。
  3. 可以通过一个简单的http调用AJAX将其作为CGI脚本运行-随便将鼠标移动到的坐标,例如:

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

PS:对于任何问题,都有数百个借口,说明为什么以及如何-不能,不应该-要做。会实现的。


13
我认为我们所有人都参与其中,直到“ c可执行文件”为止……xD
dGRAMOP

1
网络服务器?也许您的意思是带有http界面的程序..不需要网络。Go编程语言可能比C语言更具优势,因为它可以使添加http部分变得容易,或者作为替代,nodejs解释器将很容易地运行还可以包含h​​ttp接口的代码,因为nodejs解释器的构建使其易于实现。编写服务器应用程序。
barlop

3
C = 0依赖项。网络是http。这里没有可爱的主页。
亚历克斯·格雷

+1为PS。我们可以使用节点dev-server或任何类似的npmjs.com/package/http-server来执行CGI调用吗?
ATHER

1
你们中有没有人注意到Javascript问题下方的标签?

80

我想如果不使用真实的(系统)鼠标光标,就可以将鼠标光标放置到屏幕的给定区域。

例如,您可以创建一个图像来代替光标,处理一个事件,该事件在检测到鼠标进入场景时将系统光标的样式设置为“ none”(sceneElement.style.cursor = 'none'),然后显示一个隐藏的图像元素根据预定义的轴/边界框平移将光标作为场景中您喜欢的任何位置。

这样,无论您如何移动真实光标,翻译方法都可以将图像光标保持在所需的位置。

编辑:使用图像表示和强制鼠标移动的jsFiddle中的示例


5
是的你可以。您只需将给定元素上的光标样式设置为“无”。试试看。
Xaxis

14
这是最周到的答案。并实际上提供了一个真正的解决方案,而其他一些答案实际上会增加任何价值:)但是,当我们无法获得任何鼠标锁时,webgl将如何带来FPS等有趣的游戏,这听起来很有限……
Dennkster 2011年

3
仍然存在无法将鼠标“继续移动”到左侧的问题。鼠标离开网页后,您将无法继续对其进行控制。
dionyziz 2011年

2
这是解决此问题的完美解决方案。有人抱怨的唯一原因是这不是一个简单的解决方案。有时您必须做一些编程!
Marty 2013年

5
打得四处这个想法,并做出的jsfiddle为例jsfiddle.net/jaakkytt/9uczV
雅克Kütt

65

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

如果愿意,请过来发表您的反馈意见,并发表意见:

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

谢谢!



51
如果发生这种情况,我将使用浏览器退出。:-P严重的是,网站只是不需要您在安装应用程序时所给予的同意。如果我们所有人都只是采用这种级别的控制来改善用户体验,那么这将是一个很棒的功能。不幸的是,互联网是一个混蛋中心,这就是为什么我们希望许多新功能无法在浏览器中看到的原因。话虽这么说:全屏API可以“锁定”操作系统的其余部分。
某人2015年

4
在应用程序可能进行这种锁定之前,将需要@Someone同意(类似于现在流行的Web浏览器中要求全屏同意的方式)。此外,用户始终可以通过按ESC键来撤消同意。
dionyziz 2015年

7
发生了 而且非常棒(如果仍由供应商作为前缀):mdn.github.io/pointer-lock-demo
ericsoco

1
@ericsoco很遗憾,该链接已断开。这可能会有所帮助:https
Tian van Heerden

46

您可以检测鼠标指针的位置,然后移动网页(相对于正文位置),以便它们悬停在您希望它们单击的内容上。

例如,您可以将此代码粘贴到浏览器控制台中的当前页面上(然后刷新)

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

2
如果您可以发布实现此功能的代码示例,那么您的帖子将更有价值。另外,我建议您看一下FAQ:stackoverflow.com/faq
ForceMagic 2012年

用户单击后,如何实际单击正确的元素?
毫米

@momomo您可以使用document.getElementByID('thingtoclick').click();
级联样式

1
那完全是恒星!开箱即用的思维方式!我怀疑它是否真的可以提供发问者想要的东西,但是像以前一样酷,谁在乎呢?
gcdev


4

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


1
安全隐患远非显而易见。实际上,最近对标准的添加引入了此功能,而没有任何严重的安全问题。
dionyziz

但是拖放API怎么可能?
oldboy

0

难道不能简单地通过获取鼠标指针的实际位置然后基于此补偿来计算和补偿Sprite / Scene鼠标动作来完成?

例如,您需要鼠标指针位于底部中央,但它位于左上方;隐藏光标,使用移动的光标图像。移位光标移动并映射鼠标输入以匹配重新定位的光标精灵(或“控件”)单击。当/如果达到边界,则重新计算。如果/当光标实际到达您想要的点时,请取消补偿。

免责声明,不是游戏开发商。


本质上与Xaxis答案相同。
mathheadinclouds

@mathheadinclouds确实是,但是独立于鼠标锁的浏览器实现。因此,本质上;但不是。谢谢您的意见。-编辑:没关系。我明白你在说什么 我想那时候,我唯一的想法就是,这不是没有用的。比Xaxis的答案更多的是外行。
Eric Shoberg
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.