summaryrefslogtreecommitdiffstats
path: root/js/vendor/masonry/README.mdown
diff options
context:
space:
mode:
Diffstat (limited to 'js/vendor/masonry/README.mdown')
-rw-r--r--js/vendor/masonry/README.mdown80
1 files changed, 80 insertions, 0 deletions
diff --git a/js/vendor/masonry/README.mdown b/js/vendor/masonry/README.mdown
new file mode 100644
index 000000000..23e737980
--- /dev/null
+++ b/js/vendor/masonry/README.mdown
@@ -0,0 +1,80 @@
+# Masonry
+
+_Cascading grid layout library_
+
+Masonry works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet.
+
+See [masonry.desandro.com](http://masonry.desandro.com) for complete docs and demos.
+
+## Install
+
+### Download
+
++ [masonry.pkgd.js](https://github.com/desandro/masonry/raw/master/dist/masonry.pkgd.js) un-minified, or
++ [masonry.pkgd.min.js](https://github.com/desandro/masonry/raw/master/dist/masonry.pkgd.min.js) minified
+
+### CDN
+
+Link directly to Masonry files on [npmcdn](https://npmcdn.com/).
+
+``` html
+<script src="https://npmcdn.com/masonry-layout@4.0/dist/masonry.pkgd.js"></script>
+<!-- or -->
+<script src="https://npmcdn.com/masonry-layout@4.0/dist/masonry.pkgd.min.js"></script>
+```
+
+### Package managers
+
+Bower: `bower install masonry --save`
+
+[npm](https://www.npmjs.com/package/masonry-layout): `npm install masonry-layout --save`
+
+## Initialize
+
+With jQuery
+
+``` js
+$('.grid').masonry({
+ // options...
+ itemSelector: '.grid-item',
+ columnWidth: 200
+});
+```
+
+With vanilla JavaScript
+
+``` js
+// vanilla JS
+// init with element
+var grid = document.querySelector('.grid');
+var msnry = new Masonry( grid, {
+ // options...
+ itemSelector: '.grid-item',
+ columnWidth: 200
+});
+
+// init with selector
+var msnry = new Masonry( '.grid', {
+ // options...
+});
+```
+
+With HTML
+
+Add a `data-masonry` attribute to your element. Options can be set in JSON in the value.
+
+``` html
+<div class="grid" data-masonry='{ "itemSelector": ".grid-item", "columnWidth": 200 }'>
+ <div class="grid-item"></div>
+ <div class="grid-item"></div>
+ ...
+</div>
+```
+
+## License
+
+Masonry is released under the [MIT license](http://desandro.mit-license.org). Have at it.
+
+* * *
+
+Made by David DeSandro