如何獲取div位置並稍后重新放置（在MAC上）

Question

我正在創建一個APP，它將為用戶提供可拖動的元素。 我想保存元素的位置，以便以后在同一位置重新定位。 我在stackoverflow上發現了一些類似的問題，但看起來像是有人因為同樣的問題而通過了。 所以，我想知道我是否理解不正確。

基本上我的問題是：根據窗口的調整，元素位置的值可能會有所不同。

示例：如果在窗口調整到其原始大小的50％（小於）的情況下捕捉到元素的左側位置，則左側位置將不同於100％尺寸。

因此，如果用戶將窗口的元素調整少了50％，並在同一用戶返回時將其保存，則這些元素將變得一團糟（如果窗口的大小不同）。

我有這個例子http://jsfiddle.net/EV5JZ/1/

如果轉到控制台，您將看到（值）：

console.log($('#section > li:eq(0)').find('.element:last()').position().left);

如果您調整窗口大小，將獲得不同的值。

因此，我缺少某些東西還是應該使用特定的方法？

CSS：

 <style>
    body, html {
      height: 100%;
      overflow: hidden;
    }

    #section { 
        list-style-type: none; 
        padding: 0px; 
        margin: 0px;
    }
    #section li { 
        margin: 0px 0px 1px 0px; 
        width: 99.9%; 
        background-color:#ccc; 
        border: 0px solid red; 
        min-height: 100px; 
        float: left;
    }
    </style>

HTML：

<div id="central-panel">

  <div id="template">
      <ul id="section">
        <li>

          <div class="element">1</div>
          <div class="element">2</div>
          <div class="element">3</div>
          <div class="element">4</div>

        </li>
        <li><span>::</span>Item 2</li>
        <li><span>::</span>Item 3</li>
        <li><span>::</span>Item 4</li>
      </ul>
  </div>

</div>

更新 ：

好吧，我找到了如何在Windows上修復它，但是我意識到最大的問題在於MAC。

基本上，如果我將元素類上的float：left更改為none或將id模板從“％”更改為“ px”，如下所示，我可以解決此問題，但在MAC上，它將保持錯誤的行為。

.element { 
float: none; 
}

#template {
width: 1000px; 
}

任何想法？

Answer 1

好吧，實際上我正在嘗試以最糟糕的方式做。

我的布局是流動的，因此所有內容都用“％”定義。 當我嘗試重新放置元素時，我需要減去為放置在元素之前的布局元素的“寬度”保存的左側位置，但是這些布局元素可以根據調整的大小來更改其“寬度”的問題。因此，分辨率也會受到影響。

我應該重新定位的元素位於用“ px”定義的DIV元素內。 因此，這種方式要容易得多。 我只是從中取出“ float：left”，並得到了像$ .css（'left'）這樣的位置。

問題是我的方法。 現在基本上我可以像這樣重新定位：

得到

$('#section > li:first()').find('.element:last()').css('left')

復位

$('#section > li:first()').find('.element:last()').css('left', '536px');