克隆和調整div的大小相對於其內容

Question

首先我想說 - 我不想讓別人去做我的編碼。我只是在尋找提示/指針/建議。

背景：

我使用jQuery和jQueryUI的拖/放

1. 我有尺寸500像素X 500像素可投放股利。這是#div-droppable。

2. 我有相同的尺寸#div-droppable可拖動DIV。我們稱之爲#div-draggable。

3. 從#div-draggable有很多可拖動的產品，可拖動到#div-droppable。

4. 每個產品在#div-draggable具有尺寸50像素50像素X。

實施例： 我已拖50個產品從#div-draggable到#div-droppable，現在它們是絕對定位在#div-droppable內。

現在我想在#div-droppable內容保存到第三DIV叫#div-draft。 #div-draft的尺寸爲250px * 250px。我希望位於#div-droppable的產品與#div-draft相關。

我的想法：

如果一個拖產品是絕對定位與左邊的#div-droppable內：50像素和頂部：100px的，在#div-draft同樣的產品將定位與左：25px的和頂部：50px的（因爲#div-draft是#div-droppable的一半大小）。同樣，每個產品的尺寸將是一半大小（25像素* 25像素）

我可以做一些計算在#div-droppable（如上所述）的所有產品，並把每一個產品在#div-draft

我的問題： 有沒有其他的方式/更聰明的方式/更好的方式來做到這一點？我基本上希望克隆某個div（#div-droppable）內容到另一個div（#div-draft），但我希望內容的大小相對於#div-draft的大小。

Answer 1

你將如何做到這一點，當然，取決於內容，但我假設你不使用的圖像。如果你這樣做很簡單，只需使用CSS來改變圖像的大小。除非使用jQuery的.css()方法創建函數，否則無法克隆一組內容。您將不得不重新計算CSS或jQuery中的所有內容。

參見： http://api.jquery.com/css/