Resize problem when nanoGallery is `display:none`

[bloxidge]

I am currently using nanoGallery on a gallery page that showcases photos, music, and videos. The different showcases are separate by tabs and these tabs operate by changing the css property of all the content not in the currently selected tab to display:none. I'm guessing nanoGallery uses javascript to resize the gallery container to keep the tiles centered but still inline (i have used similar technique on the VIDEOS tab).

The problem is that when the nanoGallery is not visible, and the window is resized, it assumes nanoGallery has no width so when you go back to displaying it, it shows a single-width column, until the window is resized again.

With the VIDEOS tab, I referenced the width of an element outside the tabs so it would still resize even when not displayed. How can i do the same for the nanoGallery?

Thanks

See page in question here.

[Kris-B]

You're right, when not displayed, nG has no width and it cannot detected that it's visible again. Your solution may work, but it's not implemeted at this time.

Another solution, would be to force a resize when the tab is displayed again. Example: $('#yourElement').nanoGallery('refreshSize');

[bloxidge]

That's perfect, it's exaclty what I've been looking for, a dedicated function to trigger the resizing. Thanks! Admittedly I've had to put a "setTimeout" of 1 ms on it so that it comes after the gallery has re-appeared, but now it works.

Much appreciated!

[Kris-B]

;-)