diff --git a/_includes/change-sizes.js b/_includes/change-sizes.js new file mode 100644 index 0000000..2267f3b --- /dev/null +++ b/_includes/change-sizes.js @@ -0,0 +1,14 @@ + + // change size of clicked element + $container.delegate( '.element', 'click', function(){ + $(this).toggleClass('large'); + $container.isotope('reLayout'); + }); + + // toggle variable sizes of all elements + $('#toggle-sizes').find('a').click(function(){ + $container + .toggleClass('variable-sizes') + .isotope('reLayout'); + return false; + }); diff --git a/_includes/elements-demo-foot.html b/_includes/elements-demo-foot.html index 4a1821c..29fe9b2 100644 --- a/_includes/elements-demo-foot.html +++ b/_includes/elements-demo-foot.html @@ -45,16 +45,10 @@ {% include option-set-buttons.js %} - // toggle variable sizes of all elements - $('#toggle-sizes').find('a').click(function(){ - $container - .toggleClass('variable-sizes') - .isotope('reLayout'); - return false; - }); - {% include layout-change.js %} + {% include change-sizes.js %} + {% include add-buttons.js %} $('#shuffle a').click(function(){ @@ -62,11 +56,7 @@ return false; }); - // change size of clicked element - $container.find('.element').live('click', function(){ - $(this).toggleClass('large'); - $container.isotope('reLayout'); - }); + }); diff --git a/_includes/option-buttons.js b/_includes/option-buttons.js deleted file mode 100644 index f4e01b0..0000000 --- a/_includes/option-buttons.js +++ /dev/null @@ -1,12 +0,0 @@ - - // switches selected class on buttons - $('#options').find('.option-set a').click(function(){ - var $this = $(this); - - // don't proceed if already selected - if ( !$this.hasClass('selected') ) { - $this.parents('.option-set').find('.selected').removeClass('selected'); - $this.addClass('selected'); - } - - }); diff --git a/_posts/demos/2011-01-11-images.html b/_posts/demos/2011-01-11-images.html index 4df2174..b9b89e6 100644 --- a/_posts/demos/2011-01-11-images.html +++ b/_posts/demos/2011-01-11-images.html @@ -15,7 +15,7 @@ photos: ---
-

Isotope is triggered after all images are loaded with the imagesLoaded plugin.

+

Isotope is triggered after all images are loaded with the imagesLoaded plugin.

diff --git a/_posts/demos/2011-03-29-combination-filters.html b/_posts/demos/2011-03-29-combination-filters.html index 90fd04f..83c08c3 100644 --- a/_posts/demos/2011-03-29-combination-filters.html +++ b/_posts/demos/2011-03-29-combination-filters.html @@ -22,10 +22,10 @@ schema: {% for group in page.schema %}

{{ group.name }}

-
@@ -61,32 +61,40 @@ schema: var $container = $('#container'), filters = {}; + $container.isotope({ + itemSelector : '.color-shape', + masonry: { + columnWidth: 80 + } + }); + // filter buttons $('.filter a').click(function(){ - var $this = $(this), - isoFilters = [], - prop, selector; + var $this = $(this); + // don't proceed if already selected + if ( $this.hasClass('selected') ) { + return; + } + + var $optionSet = $this.parents('.option-set'); + // change selected class + $optionSet.find('.selected').removeClass('selected'); + $this.addClass('selected'); + // store filter value in object // i.e. filters.color = 'red' - filters[ $this.data('group') ] = $this.data('filter'); - - for ( prop in filters ) { + var group = $optionSet.attr('data-filter-group'); + filters[ group ] = $this.attr('data-filter-value'); + // convert object into array + var isoFilters = []; + for ( var prop in filters ) { isoFilters.push( filters[ prop ] ) } - selector = isoFilters.join(''); + var selector = isoFilters.join(''); $container.isotope({ filter: selector }); return false; }); - {% include option-buttons.js %} - - $container.isotope({ - itemSelector : '.color-shape', - masonry: { - columnWidth: 80 - } - }); - }); \ No newline at end of file diff --git a/_posts/docs/2010-12-03-options.mdown b/_posts/docs/2010-12-03-options.mdown index ef7d1c9..4b6a520 100644 --- a/_posts/docs/2010-12-03-options.mdown +++ b/_posts/docs/2010-12-03-options.mdown @@ -265,7 +265,7 @@ The property name of the method within the `getSortData` option to sort item ele
true
-Isotope uses CSS3 transform to position item elements, when available in the browser. Setting `transformsEnabled` to false will disable this feature so all browsers use top/left absolute positioning. Useful for [resolving issues with Flash content](troubleshooting.html#flash). +Isotope uses CSS3 transform to position item elements, when available in the browser. Setting `transformsEnabled` to false will disable this feature so all browsers use top/left absolute positioning. Useful for [resolving issues with Flash content](help.html#flash). ### Additional CSS {#transformsEnabled-css} diff --git a/_posts/docs/2010-12-10-adding-items.mdown b/_posts/docs/2010-12-10-adding-items.mdown index 622e949..cf81113 100644 --- a/_posts/docs/2010-12-10-adding-items.mdown +++ b/_posts/docs/2010-12-10-adding-items.mdown @@ -43,7 +43,7 @@ The [`appended` method](methods.html#appended) is a convenience method triggers [**See Demo: Infinite Scroll**](../demos/infinite-scroll.html). -See also [Infinite Scroll with filtering or sorting](troubleshooting.html#infinite_scroll_with_filtering_or_sorting) +See also [Infinite Scroll with filtering or sorting](help.html#infinite_scroll_with_filtering_or_sorting) ## Prepending diff --git a/_posts/tests/2011-05-13-jquery-animation01.html b/_posts/tests/2011-05-13-jquery-animation01.html index 7fba8fc..dc9f3a4 100644 --- a/_posts/tests/2011-05-13-jquery-animation01.html +++ b/_posts/tests/2011-05-13-jquery-animation01.html @@ -75,19 +75,7 @@ category: tests {% include option-set-buttons.js %} - // change size of clicked element - $container.find('.element').live('click', function(){ - $(this).toggleClass('large'); - $container.isotope('reLayout'); - }); - - // toggle variable sizes of all elements - $('#toggle-sizes').find('a').click(function(){ - $container - .toggleClass('variable-sizes') - .isotope('reLayout'); - return false; - }); - + {% include change-sizes.js %} + }); \ No newline at end of file diff --git a/_posts/tests/2011-05-18-centered-masonry.html b/_posts/tests/2011-05-18-centered-masonry.html index 63e3c23..b19b7e5 100644 --- a/_posts/tests/2011-05-18-centered-masonry.html +++ b/_posts/tests/2011-05-18-centered-masonry.html @@ -132,33 +132,18 @@ category: tests return $elem.find('.name').text(); } } - }); - - {% include option-set-buttons.js %} - - // change size of clicked element - $container.find('.element').live('click', function(){ - $(this).toggleClass('large'); - $container.isotope('reLayout'); - }); + + {% include option-set-buttons.js %} - // toggle variable sizes of all elements - $('#toggle-sizes').find('a').click(function(){ - $container - .toggleClass('variable-sizes') - .isotope('reLayout'); - return false; - }); + {% include add-buttons.js %} - {% include add-buttons.js %} + {% include change-sizes.js %} - $('#shuffle a').click(function(){ - $container.isotope('shuffle'); - return false; + $('#shuffle a').click(function(){ + $container.isotope('shuffle'); + return false; + }); }); - - - }); \ No newline at end of file diff --git a/_posts/tests/2011-05-24-elements-complete-test.html b/_posts/tests/2011-05-24-elements-complete-test.html index 68e0a6e..6605bcd 100644 --- a/_posts/tests/2011-05-24-elements-complete-test.html +++ b/_posts/tests/2011-05-24-elements-complete-test.html @@ -121,23 +121,9 @@ category: tests return false; }); - {% include layout-change.js %} - - // change size of clicked element - $container.find('.element').live('click', function(){ - $(this).toggleClass('large'); - $container.isotope('reLayout'); - }); - - // toggle variable sizes of all elements - $('#toggle-sizes').find('a').click(function(){ - $container - .toggleClass('variable-sizes') - .isotope('reLayout'); - return false; - }); - + + {% include change-sizes.js %} {% include add-buttons.js %} @@ -146,8 +132,5 @@ category: tests return false; }); - {% include option-buttons.js %} - - });