jquery-ui-draggable如何允許使用position：relative？

Question

我正在更新我自己的可拖動腳本，我想知道jquery-ui如何讓您將元素的位置設置爲相對，並且仍然允許您移動它，而不會影響它周圍的任何元素也定位相對和浮動？

截至目前，我的當前腳本會獲取任何元素並獲取其位置，但當您拖動它時會將其設置爲絕對，結果它周圍的所有元素最終都會移位以取代原來的位置。

我只有兩個想法是：

一）自動將頁面上的所有元素的位置是：絕對的，當我移動一個這是拖動（似乎真的效率低下）。

b）創建當前元素的不可見副本，它將保留在確切位置。

和基本上實現：

var e = document.getElementById('div'); 
console.log(document.defaultView.getComputedStyle(e, null).getPropertyValue("position")); 

從中我可以確定步驟a或b爲甚至不需要。

但是，從我可以告訴，對我來說，似乎jquery-ui-draggable沒有這些。

下面是這種使用jQuery-UI-拖動一個例子：http://jsfiddle.net/aNk6e/17/

如何可以完成同樣的效果呢？

Answer 1

這就是position: relative的工作原理。元素仍然影響文檔，就好像它處於原始位置一樣，但可以移動。

考慮這個小提琴：

http://jsfiddle.net/aNk6e/18/

通知其他兩個項目的方式仍受到彷彿元素是在原來的位置，但元件移動。

通過簡單地操縱top和left，您可以移動元素而不會影響文檔流程中的其他元素。