我如何找到jquery中移動div的座標

Question

我怎樣才能找到我的移動div的座標？我希望能夠在移動後找到座標，以便我可以爲遊戲添加邊界，讓它從divs位置拍攝激光等。非常感謝您的提前！

編輯：

我嘗試使用這樣的：

var offsets = $('#img').offset(); 
var top = offsets.top; 
var left = offsets.left; 
if (left > 0) {$('#img').animate({left: "-=10px"}, 'fast');} 

這個沒有工作，所以我測試一下，看看發生了什麼事通過將：

setTimeout(function() {alert(left);}, 5000); 

我再遷它發現它並沒有更新Div的位置，因爲警報激活後它給了我一個不是原始css值的數字，而是靠近它可能是因爲它是一個不規則的div或偏移的工作方式。

---

var state = 1; 


$(document).ready(function() { 

$(document).keydown(function(key) { 
    if(state == 1) { 
    switch(parseInt(key.which,10)) { 
     // Left 
     case 37: 
      $('#img').animate({left: "-=10px"}, 'fast'); 
     state = 2; 
     setTimeout(function() { 
      state = 1; 
     }, 200); 
      break; 
     // Up 
     case 38: 
     $('#img').animate({top: "-=10px"}, 'fast'); 
     state = 2; 
     setTimeout(function() { 
      state = 1; 
     }, 200); 
      break; 
     // Right 
     case 39: 
     $('#img').animate({left: "+=10px"}, 'fast'); 
     state = 2; 
     setTimeout(function() { 
      state = 1; 
     }, 200); 
      break; 
     // Down 
     case 40: 
     $('#img').animate({top: "+=10px"}, 'fast'); 
     state = 2; 
     setTimeout(function() { 
      state = 1; 
     }, 200); 
      break; 
    } 
    } 
}); 
}); 

Answer 1

使用jQuery.offset()獲得座標相對於父元素的偏移量的偏移座標相對於文檔或jQuery.position()得到。

這兩種方法都會返回一個屬性爲top和left的對象。

var $movableDiv = $('#img'), 
    imgAbsolutePosition, 
    setImgAbsolutePosition; 

setImgAbsolutePosition = function() { 
    imgAbsoultePosition = $movableDiv.offset(); 
}; 

$('#img').animate({top: "+=10px"}, { 
    duration: 'fast', 
    complete: setImgAbsolutePosition 
}); 

如果一個元素的位置改變，你必須與jQuery.offset()再次檢索和更新你的變量left和top。

它給了我一個數字，不是原始的CSS值，但接近它

考慮到border，padding和元素及其容器margin。

而且 Example