Laura Chesches
Laura Chesches

Reputation: 2583

Isotope Pagination with load more

I used the isotope from the site http://isotope.metafizzy.co/ and implemented a method to use load more items by pressing a button. The problem is that when i hide the elements to display only the initial number of elements, my isotope grid won't scale. If i press the show more button, the layout accurately scales.

It seems that

  $grid.isotope('hideItemElements', $(this)).isotope('layout');

but

 $grid.isotope('revealItemElements', $(this)).isotope('layout');

works just fine. Can you please tell me what am i doing wrong?

Here is a demo in codepan: http://codepen.io/laura-chesches/pen/RKPWGo

Upvotes: 2

Views: 8908

Answers (1)

Laura Chesches
Laura Chesches

Reputation: 2583

I managed to resolve my own problem and make a functional load more (show more) button. Here is the working code:

http://codepen.io/laura-chesches/pen/xgEOpY

It seems that i shouldn't have used arrangeComplete event, i just needed to create a new function in which i used:

 var itemElems = $grid.isotope('getFilteredItemElements');

Upvotes: 6

Related Questions