0

我正在使用可排序的 JqueryUI，以便我可以对块进行排序和重新排列。鉴于我不知道每个块的高度并且它们不断变化（因为它们是可排序的），我试图让所有高度与每行的最大高度相等。如何获得每行的最大高度？

这是我正在使用的一个示例：http: //jsfiddle.net/zrNNZ/40/

我正在使用内联块。这是CSS：

.blocks {
padding: 0px;
border: 0px;
margin: 0px;
display: inline-block;
font-size:0px;
width: 600px;
}

.block {
opacity: 1.0;
display: inline-block;
vertical-align: top;
position:relative;
padding: 0px;
border: 0px;
margin-right: 2px;
margin-bottom: 2px;
border-spacing: 0px;
};

正如您在示例中看到的那样，从下一行开始的每个块自然会适应前一行的最大高度。而不是在较小的块和较大的块之间有很多空白空间，我想要行的最大高度，以便我可以拉伸较小的块，使每行具有相同的高度。每行的最大高度可以变化，我只希望所有高度一直相同。

4

1 回答 1

0

希望这会对您有所帮助，如果您有任何问题，请告诉我。我正在使用停止事件并寻找左侧位置的位置，0以便我知道它是一个新行。 

stop: function(event, ui){
    //alert('stopped'); 
    var row = 0;
    var maxheight = 0;
    $('.block').each(function(){
        if($(this).position().left == 0){
            if(row > 0)
                alert('Row ' + row + ' max-height: ' + maxheight);
            row++;
            maxheight = $(this).height(); 
        }
        else {
            if(maxheight < $(this).height())
                maxheight = $(this).height();
        }
    });
    if(row > 1)
        alert('Row ' + row + ' max-height: ' + maxheight);
}

这是一个小提琴

http://jsfiddle.net/zrNNZ/43/

于 2013-11-12T00:00:27.957 回答