全球鼠標移動

我已經在我的基於jQuery的網站中使用了以下JavaScript。它的作用是向上/向下移動滑塊，並將項目縮放到更高/更小的位置。全球鼠標移動

一切工作正常，但由於滑塊只有幾個像素的高度，移動事件有點慢（它不會觸發每個像素），所以當我快速移動鼠標時，滑塊不能等待，鼠標離開滑塊項目。 mouseMove事件不會被觸發，因爲它被綁定到滑塊。我想所有的東西都可以通過將mouseMove全局設置爲整個網站來解決，但它不起作用，或者至少我不知道如何做到這一點。它是否應該受到文件或身體的約束？

這裏是我的滑塊當前代碼：

$.fn.resize = function (itemToResize) { 

MinSize = 100; 
MaxSize = 800; 

pageYstart = 0; 
sliderMoveing = false; 
nuskriverHeight = 0; 

this.mousedown(function(e) { 
pageYstart=e.pageY; 
sliderMoveing = true 
nuskriverHeight = parseFloat((itemToResize).css('height')); 
}); 

this.mouseup(function() { 
sliderMoveing = false 
}); 

this.mousemove(function(e) { 
if (sliderMoveing) { 
    (itemToResize).css('height', (nuskriverHeight + (e.pageY - pageYstart))); 
    if (parseFloat((itemToResize).css('height')) > MaxSize) { (itemToResize).css('height', MaxSize) }; 
    if (parseFloat((itemToResize).css('height')) < MinSize) { (itemToResize).css('height', MinSize) }; 
}; 
});

};

感謝您的幫助，非常感謝

來源

2010-05-28 Jacob Kofoed

放在document

var $doc = $(document); 

this.mousedown(function(e) { 
    pageYstart=e.pageY; 
    sliderMoveing = true 
    nuskriverHeight = parseFloat((itemToResize).css('height')); 

    $doc.mouseup(function() { 
    sliderMoveing = false ; 
    $doc.unbind('mousemove mouseup') 
    }); 

    $doc.mousemove(function(e) { 
    if (sliderMoveing) { 
    (itemToResize).css('height', (nuskriverHeight + (e.pageY - pageYstart))); 
    if (parseFloat((itemToResize).css('height')) > MaxSize) { (itemToResize).css('height', MaxSize) }; 
    if (parseFloat((itemToResize).css('height')) < MinSize) { (itemToResize).css('height', MinSize) }; 
    }; 
    }); 

});

來源

2010-05-28 12:28:35 user113716

這奏效了，謝謝:)其實，這解釋了很多事情不僅僅是這一特定問題更適合我：d謝謝您！ – 2010-05-28 13:30:11

但是，如果元素或其父母之一調用'stopPropagation（）'？在任何情況下，有沒有辦法在全局觸發'onmousemove'事件（對於'document'或'window'）而不使用定時器？ – StanE 2017-10-21 09:21:50

鼠標事件通常是你觀看mousedown上的滑塊（開始拖動），而當你拖動你注意mousemove和mouseup（和keypress，如果你想允許Esc取消等）document的任何地方。

來源

2010-05-28 12:29:22

在mousedown，不應該將事件處理程序（在document）綁定到mousemove和mouseup。

在mouseup處理程序中，應該再次斷開兩個全局處理程序。

但是，它可能是簡單的使用jQuery的可拖動的UI：http://jqueryui.com/demos/draggable/

來源

2010-05-28 12:31:17 ignaZ

全球鼠標移動

回答

相關問題