Jquery的 - 動態當另一個DIV是內部

如何更改寬度與DIV容器的Jquery的當另一個DIV裝入內部（通過PHP）加載調整容器DIV寬度容器？Jquery的 - 動態當另一個DIV是內部

這是我的HTML代碼

<div id="container"> 
    <div class="item"> Content 1 </div> 
</div>

現在，我有一個以dinamically填充每個頁面中的「容器」。另一個頁面可能有這樣的HTML代碼

<div id="container"> 
    <div class="item"> Content 1 </div> 
    <div class="item"> Content 2 </div> 
    <div class="item"> Content 3 </div> 
</div>

「項目」是float：離開; 我想連續使用所有「項目」。如何在內部加載「項目」時動態更改「容器」寬度？

我使用滾動條jQuery插件，滾動的div。

請幫忙！

來源

2012-04-09 DavidF

請設置一個例子，在http://jsfiddle.net/ – Alp 2012-04-09 22:34:03

你需要這樣的東西嗎？

$(document).ready(function(){ 
    var youtWidth = 100; 
    $('#container').width($('#container .item').length * yourWidth); 
})

這將統計#container中的元素並將#container寬度設置爲元素數量的倍數。在這個例子中，我保持每個元素100px。

法比奧

來源

2012-04-09 22:38:47 wezzy

你可以計算出孩子的寬度和總施用於容器，就像這樣：

var contentWidth = 0; 

$('#container .item').each(function() { 
    // outerWidth(true) includes margins 
    contentWidth += $(this).outerWidth(true); 
}); 

$('#container').width(contentWidth);

演示：http://jsfiddle.net/jtbowden/SQASY/

或者，一些基本的CSS，你可以請儘量避免使用JavaScript：

演示：http://jsfiddle.net/jtbowden/YBKxn/1/

來源

2012-04-09 22:43:16

是的，我寧願與CSS的形式給出了去... – 2012-04-09 22:45:26

如果項目有不同的寬度，你總是可以做：

var totalWidth = 0; 
$('#container').children('.item').each(function(){ 
    totalWidth += $(this).outerWidth(); 
}); 

$('#container').width(totalWidth);

來源

2012-04-09 22:43:47

Jquery的 - 動態當另一個DIV是內部

回答

相關問題