Pregunta

Soy capaz de encontrar la posición del cursor. Pero necesito averiguar si el ratón es estable. Si el mouse no se movió por más de 1 minuto, entonces debemos alertar al usuario.

¿Cómo es posible, hay algún evento especial para esto? (Solo para IE en javascript)

¿Fue útil?

Solución

Establezca un tiempo de espera cuando el mouse se mueva un minuto en el futuro y, si se mueve el mouse, borre el tiempo de espera:

var timeout;
document.onmousemove = function(){
  clearTimeout(timeout);
  timeout = setTimeout(function(){alert("move your mouse");}, 60000);
}

Otros consejos

¿No hay una manera de configurar un temporizador para que comience a incrementarse después de cada evento de movimiento del mouse?

Si llega a un minuto, aparece el cuadro de mensaje, pero cada vez que el mouse se mueve, el temporizador se reinicia.

Use un temporizador que restablezca su valor en el evento mousemove. Si el temporizador llega a 1 minuto - > Haz algo.

Más información sobre temporizador aquí http: //www.w3schools .com / js / js_timing.asp
Y más información sobre eventos catchin mouse aquí http: //www.quirksmode .org / js / events_mouse.html

Sí, tienes un evento onmousemove en Javascript, así que para lograr lo que necesitas solo tienes que codificar algo como esto:

startTimer();
element.onmousemove = stopTimer(); //this stops and resets the timer

Puedes usarlo en la etiqueta del cuerpo del documento, por ejemplo.

ACTUALIZACIÓN: @Marius ha logrado un mejor ejemplo que este.

Puedes usar el evento onmousemove. Dentro de él, clearTimeout () y setTimeout (your_warning, 1 minuto).

Puede usar este script / fragmento de código para detectar la posición del puntero del mouse y " recuerda " eso. Luego use un temporizador " setTimeout (...) " para verificar la posición digamos cada segundo y recordemos ese tiempo.

Si pasaron más de un minuto y la posición no ha cambiado, podría alertar al usuario.

Aquí hay una función de un solo hecho que puede verificar cualquier elemento para el movimiento:

function mouse (element, delay, callback) {

   // Counter Object
   element.ms = {};

   // Counter Value
   element.ms.x = 0;

   // Counter Function
   element.ms.y = function () {

      // Callback Trigger
      if ((++element.ms.x) == delay) element.ms.callback(element, element.ms);
   };

   // Counter Callback
   element.ms.callback = callback;

   // Function Toggle
   element.ms.toggle = function (state) {

      // Stop Loop
      if ([0, "off"][state]) clearInterval(element.ms.z);

      // Create Loop
      if ([1, "on"][state]) element.ms.z = setInterval(element.ms.y, 1);
   };

   // Function Disable
   element.ms.remove = function () {

      // Delete Counter Object
      element.ms = null; return delete element.ms;
   };

   // Function Trigger
   element.onmousemove = function () {

      // Reset Counter Value
      element.ms.x = -1;
   };

   // Return
   return element.ms;
};

Uso: mouse (elemento, retraso, devolución de llamada)

Ejemplos: Hacer que un reproductor de video oculte el mouse después de 5 segundos cuando está inactivo y en pantalla completa

let x = mouse(video, 5000, function (a) {
   if (document.webkitIsFullScreen) video.style.cursor = "none";
});

x.toggle(1); addEventListener("mousemove", function () {
   video.style.cursor = "auto";
});

Sala de chat AFK (45 segundos) (suponiendo que tenga un cuadro de chat y una función de envío de mensajes):

let x = mouse(chatBox, (45e3), function (a) {
   chatBox.send({ text: chatBox.username + " is AFK.", italic: true });
});

x.toggle(1); x.addEventListener("mousemove", function () {
  chatBox.send({ text: chatBox.username + " is no longer AFK", italic: true });
});
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top