jQuery的：mousemove事件 - 左，右內元素

我想一個div的鼠標COORDS，像這樣：jQuery的：mousemove事件 - 左，右內元素

$("#box").mousemove(function(e){ 
var x = e.pageX - this.offsetLeft; 
var y = e.pageY - this.offsetTop; 

document.getElementById("coords").innerHTML = x + ", " + y; });

但我也希望能夠告訴我們，如果遊標移到左或對;我知道我只需要將當前鼠標位置與前一個鼠標位置進行比較，但在這種情況下我不知道如何操作。

任何幫助表示讚賞。謝謝

來源

2012-12-27 user1207524

參見HTTP：//小號tackoverflow.com/a/2725963/287948 –

jQuery代碼來獲得鼠標的位置下面

jQuery(document).ready(function(){ 

    $(document).mousemove(function(e){ 
     $('#status').html(e.pageX +', '+ e.pageY); 
    }); 
})

顯然，你必須叫格「狀態」

<div id="status">0, 0</div>

要檢查是否光標移動到左邊或右邊你是對的，你必須存儲以前的位置，然後與新的比較。

在這裏，我給你寫了完整的示例：

http://jsfiddle.net/cB9Wq/

_編輯：

如果你需要讓你也需要知道的位置的分區內COORDS在div：

$(".div_container").mousemove(function(e){ 
     var relativeXPosition = (e.pageX - this.offsetLeft); //offset -> method allows you to retrieve the current position of an element 'relative' to the document 
     var relativeYPosition = (e.pageY - this.offsetTop); 
     $("#header").html("<p><strong>X-Position: </strong>"+relativeXPosition+" | <strong>Y-Position: </strong>"+relativeYPosition+"</p>") 
    }).mouseout(function(){ 
     $("#header").html("<p>Move mouse on the below blue div container! :)</p>") 
    });

要檢查鼠標變爲向左或向右，我用這個sintax：

xPrev<e.pageX ? $('#lr').html("right") : $('#lr').html("left"); 
xPrev=e.pageX;

注：這是等同於：

if(xPrev<e.pageX) { 
    $('#lr').html("right"); 
} 
else { 
    $('#lr').html("left"); 
} 
xPrev=e.pageX;

在這裏，你有工作示例：http://jsfiddle.net/cB9Wq/2/

來源

2012-12-27 00:08:14 Danilo

我可能說錯了;我正在使用相對鼠標位置#box，所以當光標在#box的左上角時，鼠標位置將始終爲0，0 - 無論#box位置如何 – user1207524

我發佈了您的工作示例， DIV。 ;） – Danilo

您可以採用如下方案：

var plotSliderLastPostion = 0; //Placed outside the scope of function (fxp like private member) 

slider.addEventListener(EVENT.MOUSE_MOVE, function(e){ 
var relativePlotBoxPositionX = e.clientX - rect.left; 
//CHECK THAT CURSOR IS MOVING RIGHT OR LEFT 
        if(relativePlotBoxPositionX > plotSliderLastPostion) { 
         console.log("right"); 
         plotSliderLastPostion = relativePlotBoxPositionX; 
        } 
        else { 
         console.log("left"); 
         plotSliderLastPostion = relativePlotBoxPositionX; 
        } 
    }, true);

來源

2017-03-08 10:03:43 redrom

jQuery的：mousemove事件 - 左，右內元素

回答

相關問題