Question

I have some divs that have dynamic heights controlled by a ‘click’ function as below:

$('.expand').click(function() {
  $(this).next('.collapse').slideToggle();
});

I am attempting to apply the jQuery wookmark plugin to the divs, and it works, apart from when their heights are dynamically resized by expanding one of the sections. However, when you resize the window, the divs ‘snap’ to the right layout when one or more of them has been expanded. I know I probably have to call a function like ‘updateWookmarkLayout()’ after I have expanded the divs, but was not sure what to call.

You can look at this example to see more clearly what I am trying to achieve.

Any help would be much appreciated, thanks in advance!

Answer 1

Author of the plugin here. The Github repository contains an example of how to handle this situation. Keep a reference to the selector that you applied the layout to, and then you can simply call the wookmark function again at a later point to manually update the layout. Check “index.html” in the “example” folder in the repository to see the code.