I'm using masonry for my layout. I'm using only 2 div widths for the content boxes, 240px and 500px. What I'd like to do is always force the 500px boxes into the middle of the layout so I have a more orderly thin thick thin layout. I created a jpeg that demonstrates what I want to achieve.
I dug into the code of the jquery.masonry.js file to try and figure it out. The best I've achieved so far is manipulating the X position of the div, but when I do that it doesn't adjust the Y pos and throws off the height calculation of further divs. query is not my first language and I'm having a hard time figuring out how each column's Y height is calculated. Anyone dug into masonry to do this before?
What I've achieved is this:
if($brick.width() === 240) {
//code here to make sure this div's x position is either 5 or 785
if($brick.width() > 260) {
//code here to make sure this divs x position is set at 265
But after I reposition these divs the Y pos is thrown off and as I loop through the content further divs Y pos will be off.
You can see the original full masonry js here: https://github.com/desandro/masonry/blob/master/jquery.masonry.js