BalancedGallery
BalancedGallery copied to clipboard
Doesn't work with multiples gallery
Hi,
When i try to make multiples gallery like this :












And i instanciate the gallery like this : ` $(window).load(function () {
$(".test").each(function() {
$( this ).BalancedGallery({
autoResize: true, // re-partition and resize the images when the window size changes
background: null, // the css properties of the gallery's containing element
idealHeight: 150, // ideal row height, only used for horizontal galleries, defaults to half the containing element's height
idealWidth: null, // ideal column width, only used for vertical galleries, defaults to 1/4 of the containing element's width
maintainOrder: true, // keeps images in their original order, setting to 'false' can create a slightly better balance between rows
orientation: 'horizontal', // 'horizontal' galleries are made of rows and scroll vertically; 'vertical' galleries are made of columns and scroll horizontally
padding: 10, // pixels between images
shuffleUnorderedPartitions: true, // unordered galleries tend to clump larger images at the begining, this solves that issue at a slight performance cost
viewportHeight: null, // the assumed height of the gallery, defaults to the containing element's height
viewportWidth: null // the assumed width of the gallery, defaults to the containing element's width
});
});
});`
The grid looks good but when i resize the first one do nothing and the second one is resized.
You can have a look at my fork. I've put a lot of work into it, fixing things and extending functionality. Also multiple instances on the same page are possible. I work on it from time to time. Maybe you want to try my version and I would be pleased to help you :-)