Mover el puntero del ratón a una posición específica?


Estoy construyendo un juego HTML5 y estoy tratando de poner el cursor del ratón sobre un cierto control en un evento específico para que moverse en una dirección específica siempre tenga el mismo resultado. Es esto posible?

Author: KatieK, 2011-01-20

9 answers

Gran pregunta. Esto es realmente algo que falta en la API del navegador Javascript. También estoy trabajando en un juego WebGL con mi equipo, y necesitamos esta función. Abrí un problema en bugzilla de Firefox para que podamos empezar a hablar de la posibilidad de tener una API para permitir el bloqueo del ratón. Esto va a ser útil para todos los desarrolladores de juegos HTML5/WebGL.

Si lo desea, venga y deje un comentario con sus comentarios, y vote cuestión:

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

Gracias!

 53
Author: dionyziz,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-02-02 20:46:57

No puede mover el mousepointer con javascript.

Solo piense en las implicaciones por un segundo, si pudiera;)

  1. El usuario piensa: "hey me gustaría hacer clic en este enlace"
  2. Javascript mueve mousecursor a otro enlace
  3. El usuario hace clic en el enlace incorrecto y descarga inadvertidamente malware que formatea su unidad c y se come sus dulces
 141
Author: Martin Jespersen,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-01-20 21:07:17
  1. Ejecute un pequeño servidor web en el equipo cliente. Puede ser una pequeña cosa de 100kb. Un script Python / Perl, etc.
  2. Incluye un pequeño ejecutable precompilado C que puede mover el ratón.
  3. Ejecútelo como un script CGI a través de una simple llamada http, AJAX, lo que sea-con las coordenadas a las que desea mover el ratón, por ejemplo:

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

PS: Para cualquier problema, hay cientos de excusas en cuanto a por qué, y cómo-no se puede, y no debe - hacerse.. Pero en este universo infinito, en realidad es solo una cuestión de determinación, en cuanto a si lo harás realidad.

 77
Author: Alex Gray,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-08-16 01:39:35

Me imagino que podría lograr colocar el cursor del ratón en un área determinada de la pantalla si no utiliza el cursor del ratón real (del sistema).

Por ejemplo, podría crear una imagen para actuar en lugar de su cursor, manejar un evento que al detectar mouseenter en su escena, establecer el estilo en el cursor del sistema a 'none' (sceneElement.style.cursor = 'none'), luego mostraría un elemento de imagen oculto que actúa como un cursor para estar en cualquier lugar que desee en la escena basado en un eje predefinido/cuadro delimitador traducción.

De esta manera, sin importar cómo movieras el cursor real, tu método de traducción mantendría el cursor de la imagen donde lo necesitaras.

Editar: un ejemplo en jsFiddle usando una representación de imagen y movimiento forzado del ratón

 68
Author: Xaxis,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-12-05 13:36:04

Puede detectar la posición del puntero del ratón y luego mover la página web (con la posición del cuerpo relativa) para que se sitúen sobre lo que desea que hagan clic.

Por ejemplo, puede pegar este código en la página actual en la consola de su navegador (y actualizar después)

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'
    });        
});
 35
Author: Amish G,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-04-03 11:11:52

No puedes mover un ratón, pero puedes bloquearlo. Nota:debe llamar a requestPointerLock en el evento click.

Pequeño ejemplo:

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

Ejemplo de documentación y código completo:

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

 9
Author: Dmitry Bosikov,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-05-13 13:48:40

Entonces, sé que este es un tema antiguo, pero primero diré que no es posible. Lo más cercano actualmente es el bloqueo del ratón a una sola posición, y el seguimiento del cambio en su x y y. Este concepto ha sido adoptado por - parece - Chrome y Firefox. Es administrado por lo que se llama Mouse Lock, y golpear escape lo romperá. De mi breve lectura, creo que la idea es que bloquea el ratón a una ubicación, y los informes de eventos de movimiento similares a hacer clic y arrastrar evento.

Aquí está la documentación de la versión:
FireFox: https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API
Chrome: http://www.chromium.org/developers/design-documents/mouse-lock

Y aquí hay una demostración bastante ordenada: http://media.tojicode.com/q3bsp /

 7
Author: Codesmith,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-02-09 20:16:00

No puede mover el puntero del ratón usando javascript, y por lo tanto por razones de seguridad obvias. La mejor manera de lograr este efecto sería colocar realmente el control debajo del puntero del ratón.

 4
Author: Sheavi,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-01-20 21:01:33

¿No se podría hacer esto simplemente obteniendo la posición real del puntero del ratón y luego calculando y compensando las acciones del ratón de sprite/escena basadas en esta compensación?

Por ejemplo, necesita que el puntero del ratón esté en la parte inferior central, pero se encuentra en la parte superior izquierda; oculte el cursor, use una imagen del cursor desplazada. Cambie el movimiento del cursor y mapee la entrada del ratón para que coincida con los clics del sprite del cursor (o 'control') reposicionados Cuando / si se alcanzan los límites, vuelva a calcular. Si / cuando el cursor realmente golpea el punto si quieres que lo sea, quita la compensación.

Descargo de responsabilidad, no es un desarrollador de juegos.

 0
Author: Eric Shoberg,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-09-25 21:32:53