我为一个基金会工作，该基金会旨在提高人们对互联网无障碍的认识。为了演示，我们想提供一个小型研讨会，模拟不同的残疾/缺陷。这是通过一个专门为这次演示创建的网站来完成的。
其中一个被证实的缺陷是有震颤，这意味着经历颤抖，难以控制的手部运动。由于这种缺陷，当鼠标在链接上时，很难准确地移动鼠标光标并按下鼠标按钮。一些老年人和有疾病的人，如帕金森氏症患者，都可能患有震颤。
现在我想以一种不可预测的方式移动鼠标光标，这样人们就很难点击一个小按钮。因为JavaScript不允许直接移动鼠标光标，所以我正在寻找其他方法来实现这一点。我有以下想法:
使用模拟鼠标晃动的鼠标驱动程序/实用程序。 通过CSS隐藏鼠标光标，在原始光标的位置放置一个晃动的鼠标光标的GIF动画(使用JavaScript)，然后让目标链接每隔几秒就可以点击一次，持续一秒钟左右。这至少会给人一种感觉，好像总是在错误的时刻点击。
虽然第一个想法很酷，但我找不到这样的工具，无论是Mac还是Windows。我自己也没有任何编程技能。
第二个想法似乎有点笨拙，但我认为它会达到预期的效果。
有人有别的想法吗?
当前回答
这只是一个让震颤“正确”的想法，你可以记录一个真实病人的鼠标运动，这使它更真实，当你告诉人们数据来自哪里。
这里有一个脚本，让猫跟随你的鼠标光标，你可以调整一个，让第二个光标跟随(跳跃)你的光标。该页面正在计算第二个游标的位置，因此它还可以确定单击事件是否成功。
如果可以的话，请让它基于网络，这样你会接触到更多的人，而不是让他们安装一个程序或激活flash或其他任何东西。
其他回答
我做了一个快速的演示，希望你能够在此基础上编写代码，使用指针锁API。
我分叉这个指针锁演示回购和修改它，以添加一个随机移动元素。
这是我GitHub页面的链接:https://aristocrates.github.io/pointer-lock-demo 这是我的回购链接:https://github.com/aristocrates/pointer-lock-demo
重要的javascript代码包含在app.js的canvasLoop(e)方法中。
与最初的演示相比，我唯一改变的地方是台词
x += movementX * 2;
y += movementY * 2;
我添加了两条线来表示随机移动:
x += Math.floor(Math.random()*3 - 1);
y += Math.floor(Math.random()*3 - 1);
还有很多地方你可以改进，但希望这能帮助你开始。
As you were thinking about doing it with a custom mouse driver I suppose a small program running on the PC would do either? If this is the case, here is a small snippet for C#, which infinitely moves the cursor randomly withing a range of plus minus 5px around the current cursor position. After each displacement the program waits 50 ms to 100 ms (not accurate!). The shakiness can be configured by adapting the values for the displacement and the pauses. I ran this in a console application and - depending on the values - it gave me quite a hard time stopping the program.
Random rand = new Random();
while(true)
{
Cursor.Position = new Point() { X = Cursor.Position.X + rand.Next(11)-5, Y = Cursor.Position.Y + rand.Next(11)-5 };
Thread.Sleep(rand.Next(50) + 50);
}
你不能指望任何人都能把他们的手握得非常稳定，所以你可以考虑的一件事是，
向用户解释你在做什么， 让演示页面上的可点击元素比正常情况下要小得多。 将示例系统上的鼠标灵敏度提高到最大。
我的理由是(注意，我不是用户体验或医学专家)通过缩小可点击元素，你为大多数人创造了一个类似的问题，患有帕金森病的人每天都会面对一个网站。
这是我的xdotool脚本使用AutoIt的windows版本。这是我的第一个AutoIt脚本，只花了几分钟就写好了，所以我相信它可以改进。只需保存扩展名。au3并使用AutoIt (run Script x86)运行它。
HotKeySet("{HOME}", "GStart")
HotKeySet("{PAUSE}", "Gpause")
HotKeySet("{ESC}", "Gexit")
While 1
Sleep(100)
WEnd
Func Gstart()
While 1
sleep(100)
$pos = MouseGetPos()
$x = $pos[0] + 10 - Random(0, 20, 1)
$y = $pos[1] + 10 - Random(0, 20, 1)
MouseMove($x,$y)
Wend
Endfunc
Func Gpause()
While 1
sleep(100)
Wend
Endfunc
Func Gexit()
MsgBox(0, "exit box", "Script exited")
Exit 0
EndFunc
控制
Home:开始模拟。 pause:暂停模拟。 Esc:退出模拟。
或者使用我在这里编译的版本。
在你的DIV中，CSS-hide光标使用cursor:none; 创建一个。png光标图像，并使用鼠标移动的jQ移动它(左，上) 使用setTimeout随机化。png的margin-left和margin-top (使重新定位平滑使用CSS3过渡或做它与jQ .animate())。
注意:脚本不能知道手是否仍然在鼠标上;)
function rand(min, max) {return Math.random() * (max - min) + min;} var $cursor = $('div img'); $('div').mousemove(function(e) { // Make .png follow the mouse coordinates $cursor.css({ left: e.pageX, top:e.pageY }); }).hover(function(e){ $cursor.toggle(); // Show .png cursor as we enter the DIV }); (function tremor(){ // Add tremor to .png image $cursor.css({ marginLeft: rand(-15,15), // arm tremor marginTop: rand(-30,30) // hand contractions }); setTimeout(tremor, rand(50,100)); }()); div{ position:absolute; background:#eee; height:100%; width:100%; cursor:none; } div img{ display:none; position:absolute; transition: margin 0.2s; } <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div><img src="http://i.stack.imgur.com/KwMGA.png"></div>
