我怎样才能像这样对我的不同高度相同宽度的缩略图进行排序？答案

【问题标题】：How can I sort my different height same width thumbnail like that?我怎样才能像这样对我的不同高度相同宽度的缩略图进行排序？
【发布时间】：2011-03-22 03:04:36
【问题描述】：

我有相同宽度但不同高度的图像...我以前见过，但我不记得我在哪里看到...我想像上面那样对缩略图进行排序。 alt text http://img153.imageshack.us/img153/9730/thumbnailjt.jpg

所以让战斗开始吧:)

【问题讨论】：

呃....什么？你有一个项目的集合，你想遍历它们的高度，重新排列它们，使它们或多或少相同的高度，然后将它们排列成列？这样更正确吗？
是的。图像具有相同的宽度但不同的高度。但是给列变量会更好。所以不需要计算列

标签： jquery image sorting thumbnails

【解决方案1】：

我相信您正在寻找jQuery Masonry plugin。

【讨论】：

【解决方案2】：

这是一个简短的示例，您可以如何对元素进行排序，然后将它们附加到其他 div。

// returns elements sorted by height
$('.elementsToSort').sort(function (a, b) {
   return $(a).height() > $(b).height() ? 1 : -1;  
});

// or loop over results and append them to another placeholder
$('.elementsToSort').children().each(function(){

    $smallest = $('.elementsToSort').sort(function (a, b) {
           return $(a).height() > $(b).height() ? 1 : -1;  
    }).first();
    $('.placeHolder').append($smallest);
})

【讨论】：