JavaScriptでアイドル状態でアクションを実行する

Question

私は、次のことを行うWebページでスクリプトを設定しようとしています。マウスが一定時間（例えば5秒間）非アクティブである場合、要素を隠すなど）。次に、移動したマウスの場合は、アクションを実行します（たとえば、要素を非表示にします）。

私が欲しいのは、ユーザーのマウスが操作されていない状態（キーボードの非アクティブ状態ではない）でアクションを実行する方法です。

ありがとうございました。

Answer 1

あなたはjQueryのを使用している場合：

(function() { 
    var timeout; 
    var isHidden = false; 
    $(document).mousemove(function() { 
     if (timeout) { 
      window.clearTimeout(timeout); 
     } 
     timeout = window.setTimeout(function() { 
      if (!isHidden) { 
       //hide the element here 
       isHidden = true; 
      } 
     }, 5000); 
     if (isHidden) { 
      //show the element here 
      isHidden = false; 
     } 
    }); 
})(); 

非jQueryのバージョン：私は、通常のJavaScriptを使用してい

(function() { 
    var timeout; 
    var isHidden = false; 

    function hideOnIdle() { 
     if (timeout) { 
      window.clearTimeout(timeout); 
     } 
     timeout = window.setTimeout(function() { 
      if (!isHidden) { 
       //hide the element here 
       isHidden = true; 
      } 
     }, 5000); 
     if (isHidden) { 
      //show the element here 
      isHidden = false; 
     } 
    } 

    if (document.addEventListener) { 
     document.addEventListener("mousemove", hideOnIdle); 
    } else { 
     document.attachEvent("onmousemove", hideOnIdle); 
    } 
})(); 

jsfiddle