Not calculating width/height when Bootstrap tab is shown or manual refresh

[alexc-hollywood]

I'm using the plugin successfully to generate 2 grids - in 2 tabs. The first (visual/shown) tab works fine, but the second (hidden) tab doesn't work at all. I'm calling the collage function when the hidden tab is shown (with a slight timeout, using imagesloaded() as it doesn't work otherwise) and the height of the parent is set to zero, and the child element is also zero (no width values are created at all). Each time i load the gallery in any instance, i have to set a timer to change the opacity, and to reload it on window.resize.

Problem happens both when i call it programmatically from the JS, and when i run the commands manually from the JS console after the tab is visible. Using jQuery('#div-area-name').removeWhitespace().collagePlus(window.array_of_default_options);

It can see the content, the tab is made visible, it runs through all the items OK, but even on a manual call to the function results in no widths, and zero heights.

[tamitutor]

I wrote a blog post about something similar here: http://excentrix.io/using-collageplus-within-bootstrap-jquery-tabs/

Hope it helps.