In this example (which is working perfectly), http://codepen.io/anon/pen/CotJv masonry.js is included, but after reading other tuturials, my understanding is that you have to not only import the script but also initialize masonry.
I currently have this codepen example working locally on my machine, but the reason I ask about how to initialize masonry is that I'm trying to change the gutter size, and I don't see anywhere to do that.
For example this line off the masonry.js website shows that you can set the columnWidth.
var container = document.querySelector('#container');
var msnry = new Masonry( container, {
columnWidth: 200,
itemSelector: '.item'
});
In the codepen I've pasted above, I do not see anything similar to this line, so I'm wondering where I need to go in the code to set columnwidth and guttersize. Also this codepen is basically a direct clone of the Tympanus masonry.js demo. http://tympanus.net/codrops/2013/07/02/loading-effects-for-grid-items-with-css-animations/ I have imported that entire demo from Tympanus onto my local machine and I don't see masonry.js being initialized anywhere. There is something I'm definitely not understanding here. Can I just take the snippet I posted above and paste in in my html in between tags? Any help would be appreciated here, all I'm trying to do is be able to control the column size and space between each picture.
Search for 'initialize masonry' in the HTML column