通過jQuery的

我加入像div元素動態使用jquery.The div CSS頁面動態添加的div是position : absolute。現在我的問題是，當我在比這一切相互重疊的同時增加超過1個div元素。有什麼辦法可以不改變我的元素的position property這些不重疊？通過jQuery的

來源

2012-06-11 King Kong

請張貼一些代碼 –

查看砌體插件。它是動態佈局插件，可以在文檔中添加新元素時自動排列div元素，防止元素重疊。看看這個link.

只需指定容器DIV讓它與ID container你需要調用函數

$(".container").masonry();

，然後當你裏面添加容器更DIV你只需要調用函數

var $newElems = $(newElements); 
$(".container").masonry('appended', $newElems);

來源

2012-06-11 14:05:52

您可以定義具有頂部，底部，左側，右側CSS屬性的絕對位置的對象的位置。所以你也必須動態改變它們。

例如：第一元件具有頂：0，左：0，第二頂部：0，左：50等等...

來源

2012-06-11 13:08:43 jakee

你將不得不計算寬度和高度並調整頂部和每個DIV因此離開，除非你想改變的位置相對。 – lucuma

當添加作爲絕對定位的元件並且不提供任何有效top和left值的元素將與頂部和左爲0

在你的情況下，所有要添加應服用位置（0,0），所以它們被重疊的一個以上的其它元素被定位絕對的。

一個解決方案是計算每個的位置並使用sith css（{'position'：'absolute'}）向它們添加相應的頂部和左側值，但是這在大多數情況下需要一些數學計算。

別擔心，您的瀏覽器已經知道數學，你可以在大多數情況下使用它，所以添加的div沒有「位置」「絕對」。現在瀏覽器佈局很好。在瀏覽器完成佈局之後，取出DIV並獲取其當前位置，並使用該位置以絕對位置佈局它們。

for(var i=0; i < noOfDivs; i++){ 
    { 
    $('#parentDiv').append('<div class="childDiv"/>'); 
    } 
$('.childDiv').css({ 
    'position': 'absolute, 
    'top' : $(this).position().top, 
    'left' : $(this).position().left 
    });

的代碼沒有經過測試，如有的DIV定位逐一應該再次引起問題，您應該從去年迭代他們第一或保存所有位置以後應用它們。如果jQuery更新單個DOM訪問中的所有位置，這將工作正常。

來源

2012-06-11 13:17:20 sabithpocker

回答

相關問題