2015-08-28 101 views
1
var mouseTrack = (function() { 
     document.onmousemove = handleMouseMove; 
     function handleMouseMove(event) { 
      var dot, eventDoc, doc, body, pageX, pageY; 

      event = event || window.event; // IE-ism 

      // If pageX/Y aren't available and clientX/Y are, 
      // calculate pageX/Y - logic taken from jQuery. 
      // (This is to support old IE) 
      if (event.pageX == null && event.clientX != null) { 
       eventDoc = (event.target && event.target.ownerDocument) || document; 
       doc = eventDoc.documentElement; 
       body = eventDoc.body; 

       event.pageX = event.clientX + 
        (doc && doc.scrollLeft || body && body.scrollLeft || 0) - 
        (doc && doc.clientLeft || body && body.clientLeft || 0); 
       event.pageY = event.clientY + 
        (doc && doc.scrollTop || body && body.scrollTop || 0) - 
        (doc && doc.clientTop || body && body.clientTop || 0); 
      } 

      console.log(event.pageX + ', ' + event.pageY); 
      // document.body.innerHTML += '<div style="position:absolute;width:3px;height:3px;background:red;right:'+(window.innerWidth-event.pageX)+'px;top:'+event.pageY+'px;"></div>' 
     } 
    }); 
    mouseTrack(); 

(試試這個在您的瀏覽器:))瀏覽器瀏覽鼠標位置的頻率如何?

如果您一試身手跨頁高靈敏度鼠標,你只能得到一個座標集的像10-20。如果你慢慢做,你會積累數百或數千分。

瀏覽器(比方說Chrome瀏覽器)輪詢鼠標位置以觸發mousemove事件的頻率甚至更高,我可以在這裏查看源代碼的位置?

+0

我注意到,一個固定的鼠標產生的事件看起來與文本輸入域中I光束閃爍的頻率相同。我想你會發現,對於移動鼠標來說,事件是在底層操作系統報告的情況下生成的。輪詢與goto語句(通常來說)差不多。 – enhzflep

回答

1

這不是造成這種效果的瀏覽器。實際上,瀏覽器根本不輪詢鼠標位置。

這是腳本引擎的實現,每個命令需要一定的執行時間,因此只能比較每個微秒的位置。如果檢測到更改,則會引發事件。

在我眼中,這是不可能命名特定時間的,因爲顯然單個命令的執行時間取決於您測試系統的特定硬件和負載。