在这个论坛中,我发现了一个jquery解决方案,可以将长ul分成多列。帖子有点老了,几天后仍然没有答案,因此我开始了一个新主题。
问题是当最后一列有几个li项时,li放在底部而不是顶部。 像这样:
columnA columnB
<li></li>
<li></li>
<li></li> <li></li>
<li></li> <li></li>
我使用的代码是:
var col_max_height = 15; //Max Items per column
var col_width = 175; //Pixels
var col_height = 18; //Pixels
$('.categories ul li ul').each(function() {
$(this).find('li').each(function(index){
column = parseInt(index/col_max_height);
$(this).css('margin-left', column * col_width + 'px')
if(column > 0) {
$(this).css('margin-top', (index - (col_max_height * column) + 1) * -col_height + 'px').addClass('col_'+column);
}
});
});
如您所见,代码将li项目从margin-top:-270px
开始。
我想从margin-top:0
开始,然后再往下走。
我看不出该怎么做......
答案 0 :(得分:0)
答案 1 :(得分:0)
尝试删除:
if(column > 0)
或将其更改为:
if(column >= 0)
这应该可以解决问题......如果没有,当列为零时,问题似乎就会发生,并且一些边缘顶部计算误导了这种情况。