You can add and remove elements from shuffle after it has been created. This also works for infinite scrolling.
// Adds 2 <div>s to an existing Shuffle instance.
+
+ // Adds 2 <div>s to an existing Shuffle instance.
var $item1 = $('<div class="gallery-item item1">')
var $item2 = $('<div class="gallery-item item2">')
var $items = $item1.add($item2);
$('#my-shuffle').append($items);
$('#my-shuffle').shuffle('appended', $items);
+
Remove a collection
-// Remove the 2 <div>s which were just added.
+
+ // Remove the 2 <div>s which were just added.
var $items = $('.gallery-item');
$('#my-shuffle').shuffle('remove', $items);
+
Check out the demo.
diff --git a/_includes/advanced-filters.html b/_includes/advanced-filters.html
index a1edff7..3a9bbcc 100644
--- a/_includes/advanced-filters.html
+++ b/_includes/advanced-filters.html
@@ -3,13 +3,16 @@
By passing a function to shuffle, you can customize the filtering to your hearts content. Shuffle will iterate over each item and give your function the element wrapped in jQuery and the shuffle instance. Return true to keep the element or false to hide it.
Example
-// Filters elements with a data-title attribute with less than 10 characters
+
+ // Filters elements with a data-title attribute with less than 10 characters
$('#grid').shuffle('shuffle', function($el, shuffle) {
return $el.data('title').length < 10;
});
+
Searching
-// Advanced filtering
+
+ // Advanced filtering
$('.js-shuffle-search').on('keyup change', function() {
var val = this.value.toLowerCase();
$grid.shuffle('shuffle', function($el, shuffle) {
@@ -23,5 +26,6 @@ $('.js-shuffle-search').on('keyup change', function() {
return text.indexOf(val) !== -1;
});
});
+
Check out the compounded filters demo.
diff --git a/_includes/credit-jake.html b/_includes/credit-jake.html
index 8d73f36..fafd5a9 100644
--- a/_includes/credit-jake.html
+++ b/_includes/credit-jake.html
@@ -1,5 +1,5 @@