jQuery function trouble

Question

I'm trying to make a script to put the elements inside a container into columns. The script works fine until I get to 4 column. I can't see where I'm going wrong. Here's the code, and the demo

var container = '.bar',
    children = $(container).children().length,
    column = 4,
    width = $(container).width() / column - 20;

function columnizer(value) {

    var i = 1,
        x = Math.ceil(value / column),
        z = Math.round(value / column),
        y = '<div class="column" />';

    $(container).children().slice(0, x).wrapAll(y);

    while (i < column) {
        if (value % 2 === 0 && z === 1 ) {
            $(container).children().slice(i, x * i).wrapAll(y);
            i++;
        }
        else if (value % 2 === 0 && z > 1) {                
            $(container).children().slice(i, x + i * i).wrapAll(y);
            i++;            
        }
        else {
            $(container).children().slice(i, x + i).wrapAll(y);
            i++;
        }
    }
}

maybe if you stop naming variables x, y and z the problem could pop out easier — Yuri Ghensev
– Yuri Ghensev, Commented Nov 13, 2011 at 2:19

mjwills · Accepted Answer · 2011-11-13 02:49:05Z

2

$(function() {

var container = '.bar',
    children = $(container).children().length,
    column = 4,
    width = $(container).width() / column - 20;

function columnizer(value) {
    var i = 0,
        x = Math.ceil(value / column),
        z = Math.round(value / column),
                y = '<div class="column" />';

    while (i < column ) {   
        $(container).children(':not("div.column")').slice(0, x).wrapAll(y);
        i++;
        }
}

columnizer(children);

$(container).append("<div class='clear'></div>");

$('.column').width(width);

});

Also, change your test data to include a number after every Lorum or Duis. Otherwise, the code may look like its working but really not be.

This technique also works for any number of columns (rather than just 4 columns).

edited Nov 13, 2011 at 2:49

answered Nov 13, 2011 at 2:43

mjwills

24.1k6 gold badges45 silver badges74 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Koalatea Over a year ago

I guess I was making it too complicated for myself. Thanks for the help.

Collectives™ on Stack Overflow

jQuery function trouble

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related