0

フィドルの最初の行としてjqueryにレイアウトのすべての行を埋める必要があります

私が十分に説明したかどうかはわかりませんが、フィドルは私が望むものを明確にするはずです。最初の 5 つの div は、行がいっぱいになるように幅が少し変更されていますが、残りの行がコンテナーをいっぱいにすることはできません。

基本的に、幅を広げてすべてのdivを正当化したい

http://jsfiddle.net/SG9Vx/

これまでのところ、ここから変更されたこの関数があります：jQueryは、フロートされたliの行ごとのアイテム数を見つけます：

var lisInRow = 0;

$('#posts div').each(function() {
if($(this).prev().length > 0) {
    if($(this).position().top != $(this).prev().position().top) return false;
    lisInRow++;
    $(this).addClass("row1");   
}
else {
       lisInRow++;  
       $(this).addClass("row1");    
   }
});

var itemNumber = $(".row1").length
var widthRow = 0;
$('.row1').each(function() {
    widthRow += $(this).outerWidth( true );
});
var widthContainer = $("#posts").width();
var remaining = widthContainer - widthRow;
leftMargin = Math.floor(remaining / itemNumber);
$(".row1").each(function(){ 
    var addedwidth = $(this).width() + leftMargin;
    $(this).width(addedwidth);
});

最初の行で行うことは、コンテナーの残りを計算し、それを行の項目数で割り、その結果を行の各項目の幅に追加することです。

4

2 に答える 2

0

これは、あなたが達成しようとしていると私が思うものの簡略版です。

var lisInRow = 0;
$('div div').each(function() {
  if($(this).prev().length > 0) {
    if($(this).position().top != $(this).prev().position().top){
      lisInRow++;
    }                   
   $(this).addClass("row" + lisInRow);  
 }
});

フィドル: http://jsfiddle.net/568mP/

于 2013-04-19T11:53:45.700 に答える