wookmark no angular
a wookmark page with no angularjs in it
by Laurie
HTML
<script src="http://cdn.jsdelivr.net/foundation/4.2.2/js/foundation.min.js"></script>
<script src="http://images.moulton.co/jquery.wookmark.min.js"></script>
<link rel="stylesheet" href="http://cdn.jsdelivr.net/foundation/4.2.2/css/foundation.css">
<body>
<!-- Main Page Content and Sidebar -->
<div class="row">
<!-- Main Blog Content -->
<div class="large-10 columns" role="content" id="items">
<ul id="tiles">
<li>
<img src="http://placehold.it/200x400">
</li>
<li>
<img src="http://placehold.it/200x300">
</li>
<li>
<img src="http://placehold.it/200x200">
</li>
<li>
<img src="http://placehold.it/200x350">
</li>
<li>
<img src="http://placehold.it/200x100">
</li>
<li>
<img src="http://placehold.it/200x150">
</li>
</ul>
</div>
<!-- End Main Content -->
</div>
<!-- End Main Content and Sidebar -->
</body>
CSS
ul {
list-style-type: none;
}
li {
border: 1px solid black;
padding: 2px;
}
JavaScript
$(document).ready(new function () {
// Call the layout function.
$('#tiles li').wookmark({
autoResize: true,
container: $('#items'),
offset: 4,
itemWidth: 205
});
});