Estoy construyendo un juego HTML5 y estoy tratando de colocar el cursor del mouse sobre un cierto control en un evento específico para que moverse en una dirección específica siempre tenga el mismo resultado. es posible?
Estoy construyendo un juego HTML5 y estoy tratando de colocar el cursor del mouse sobre un cierto control en un evento específico para que moverse en una dirección específica siempre tenga el mismo resultado. es posible?
Respuestas:
Entonces, sé que este es un tema antiguo, pero primero diré que no es posible. Lo más cercano actualmente es bloquear el mouse en una sola posición y rastrear el cambio en sus x e y. Este concepto ha sido adoptado por Chrome y Firefox. Es administrado por lo que se llama Bloqueo del mouse , y presionar escapar lo romperá. Desde mi breve lectura, creo que la idea es que bloquea el mouse en una ubicación e informa eventos de movimiento similares a los eventos de hacer clic y arrastrar.
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/
No puede mover el puntero del mouse con javascript.
Solo piense en las implicaciones por un segundo, si pudiera;)
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 mouse, por ejemplo:
http://localhost:9876/cgi/mousemover?x=200&y=450
PD: Para cualquier problema, hay cientos de excusas sobre por qué y cómo, no se puede y no se debe hacer, pero en este universo infinito, es realmente una cuestión de determinación, en cuanto a si TÚ Lo hará posible.
Me imagino que podría lograr colocar el cursor del mouse en un área determinada de la pantalla si no usara el cursor del mouse real (del sistema).
Por ejemplo, podría crear una imagen para actuar en lugar de su cursor, manejar un evento que al detectar el mouseenter en su escena, establecer el estilo en el cursor del sistema en 'none' ( sceneElement.style.cursor = 'none'
), y luego abriría un elemento de imagen oculto actuando como cursor para estar en cualquier lugar de la escena en función de una traducción predefinida de eje / cuadro delimitador.
De esta manera, no importa cómo movió el cursor real, su método de traducción mantendría el cursor de la imagen donde lo necesitara.
editar: un ejemplo en jsFiddle usando una representación de imagen y movimiento forzado del mouse
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 el bugzilla de Firefox para que podamos comenzar a hablar sobre la posibilidad de tener una API para permitir el bloqueo del mouse. Esto será útil para todos los desarrolladores de juegos HTML5 / WebGL.
Si lo desea, venga y deje un comentario con sus comentarios, y vote sobre el tema:
https://bugzilla.mozilla.org/show_bug.cgi?id=630979
¡Gracias!
Puede detectar la posición del puntero del mouse y luego mover la página web (con la posición relativa del cuerpo) para que se desplace 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'
});
});
document.getElementByID('thingtoclick').click();
No puede mover un mouse pero puede bloquearlo. Nota: que 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();
Documentación y ejemplo de código completo:
https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API
No puede mover el puntero del mouse usando javascript y, por lo tanto, por razones obvias de seguridad. La mejor manera de lograr este efecto sería colocar el control debajo del puntero del mouse.
¿No podría hacerse esto simplemente obteniendo la posición real del puntero del mouse y luego calculando y compensando las acciones del sprite / escena del mouse basadas en esta compensación?
Por ejemplo, necesita que el puntero del mouse esté en la parte inferior central, pero se encuentra en la parte superior izquierda; ocultar el cursor, usar una imagen de cursor desplazada. Cambie el movimiento del cursor y asigne la entrada del mouse para que coincida con los clics del sprite del cursor reubicado (o 'control') Cuando / si se golpean los límites, vuelva a calcular. Si / cuando el cursor realmente llega al punto que desea que sea, elimine la compensación.
Descargo de responsabilidad, no un desarrollador de juegos.
Interesante. Esto no es directamente posible por los motivos mencionados anteriormente (clics de spam e inyección de malware), pero considere este truco, que crea una impresión de lo mismo:
Digamos que tiene un div, puede usar esta propiedad css para ocultar el cursor real:
.your_div {
cursor: none
}
Simplemente cree una imagen, un cursor similar, y colóquelo dentro de su página web, con position = 'absolute'.
Esto es facil. Verifique en Internet cómo obtener la ubicación real del mouse (coordenadas X e Y).
A medida que se mueve el cursor real, mueva su pseudo cursor con la misma diferencia de X e Y. Del mismo modo, siempre puede generar un evento de clic en cualquier ubicación de su página web con javascript magic (solo busque en Internet cómo hacerlo).
Ahora, en este punto, puede controlar el pesudo cursor de la manera que desee, y su usuario tendrá la impresión de que el cursor real se está moviendo.
====
Advertencia justa: no lo hagas. Nadie quiere controlar su cursor o computadora de esta manera, a menos que tenga un caso de uso específico o si está decidido a huir de sus usuarios.