jquery isotope plugin container height will not grow with isotope-item (same with masonry)

Question

I have an isotope-item that will grow in height when somebody comments inside of it. When it grows, how do I tell the main isotope container to grow with it? Right now what is happening is, as the isotope-item grows, the isotope container maintains it's initial height that was set when calling $(".home_main").isotope(); So when I leave comments inside the isotope-item, the item grows, then is cut off by the main container. Thanks.

I have seen that you can set resizesContainer: true but this hasn't helped me. Thanks.

Not sure if it makes any difference but I have also tried this with the Masonry jquery plugin as well (seems pretty similar) and had the same problem.

Answer 1

Found the answer here:

https://github.com/desandro/isotope/issues/275

You have to call relayout like this:

$("#your_container").isotope( 'reLayout' )

Answer 2

In Isotope V2 the syntax is

$("#your_container").isotope('layout')

Answer 3

In Isotope PACKAGED v2.2.2, you can also 're-arrange / re-layout' your container:

    $(window).scroll(function(){
        $container.isotope( 'layout' );
    }

Answer 4

In Isotope V3

$(window).on('load', function(){
    var $container = $('#your_container');
    $container.isotope({
        itemSelector: '.item'
    });
});

Answer 5

If your using the latest isotope, (not specified version but you can see the date of this comment) read the first link and include the appropriate couple of lines and include the library from the second link.

http://isotope.metafizzy.co/appendix.html

http://imagesloaded.desandro.com/