javascript - movimiento - Detectando cuando el mouse no se mueve.

inactividad con javascript

Question

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)

Answer 1

¿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.

Answer 2

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

Answer 3

Podría usar este script / fragmento para detectar la posición del puntero del mouse y "recordarlo". Luego use un temporizador "setTimeout (...)" para verificar la posición, digamos cada segundo y recuerde ese tiempo.

Si ha pasado más de un minuto y la posición no ha cambiado, puede alertar al usuario.

Answer 4

Puede utilizar el evento onmousemove. En su interior, clearTimeout () y setTimeout (your_warning, 1 minuto).

Answer 5

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.

Answer 6

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

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

Answer 7

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(element, delay, callback)

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