Nic, I've got an almost-completed "listcols". If you'd like to give it a
try, let me know and I'll get you a pre-release copy. It splits a list
(UL, OL or any child nodes) into evenly balanced columns using the
actual height of the list items. It also has options for how many cols
and how wide the 'gutter' between them should be. It does not have a
means to re-render the list if items get added to it after the list gets
'converted'.
I'm not sure if it would meet your needs for this situation, but
throwing it out there in case you want to give it a try.
- Jack
Nic Hubbard wrote:
I have a list of names wrapped in <p> tags that are sorted in
alphabetical order. I am trying to build 3 even columns out of
these. There are 63 items, so each column should have 21 items. I
have a script that kind of works, but it is making my items out of
order, as it is somehow grouping them in a strange way.
var classNames = ['first', 'second', 'third'];
$('#artistsColumns p').each(function(i){
var n = Math.floor(i/10) % 3;
$(this).addClass(classNames[n]);
});
// Now lets wrap those in some divs
$('p.first').wrapAll('<div class="colFirst"></div>');
$('p.second').wrapAll('<div class="colSecond"></div>');
$('p.third').wrapAll('<div class="colThird"></div>');
Basically each group of classes get wrapped with a "column" div, but,
once of the columns is getting too many times and the items are
getting the wrong classes.
Also, how can I write this so that I can continue to add new items and
it will keep my columns as even as possible?
