knockout.isotope
A KnockoutJS binding for Isotope.
Demo
See a working demo on JSFiddle.
Requirements
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/knockout/3.0.0/knockout-debug.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery.isotope/1.5.25/jquery.isotope.js"></script>
<script src="src/knockout.isotope.js"></script>
Usage
Example Markup
<div id="container" data-bind="isotope: { data: items, options: options }">
<div class="item"></div>
</div>
Example View Model
$(function () {
var vm = new ExampleViewModel(),
items = [1, 2, 3, 4, 5, 6, 7, 8, 9];
ko.applyBindings(vm);
vm.items(items);
});
function ExampleViewModel() {
var self = this;
self.items = ko.observableArray([]);
self.options = {
itemSelector: '.item',
masonry: {
columnWidth: 500,
gutterWidth: 25,
}
};
}
Options
A javascript object containing the key/value pair Isotope options.