2ne
2ne

Reputation: 5986

Isotope - reLayout on container width change

My container is 800px. This space is occupied with the portfolio container. When then button is clicked to enable the filter menu then the portfolio container is told to have a width of 610px which leaves the remainder of the space for the filter menu. I am using the reLayout call to try and update the items but it only seems to work when the filters menu is disabled. Can anyone see where I am going wrong here? Any help would be much appreciated.

See below for the snippet of my button code. View DEMO to see all code.

$('button').click(function () {
    filtertoggle.toggleClass("filter-active");
    $container.isotope('reLayout');
});

Upvotes: 2

Views: 1498

Answers (2)

Deborah
Deborah

Reputation: 4575

For future searchers, new Isotope version changes 'reLayout' option to 'layout'. Change

$container.isotope('reLayout');

... to ...

$container.isotope('layout');

Upvotes: 0

Boris Gappov
Boris Gappov

Reputation: 2493

Try this:

  $('button').click(function(){
    filtertoggle.toggleClass("filter-active");
    setTimeout(function(){
            $container.isotope('reLayout');
        }, filtertoggle.hasClass("filter-active") ? 100: 755);
  });

example: http://codepen.io/anon/pen/nDmyB

Upvotes: 1

Related Questions