Доброго времени суток, требуется помощь!
Пытаюсь сделать фильтр элементов, так вот, есть некое меню:
<div class="option-combo color">
<h4>color</h4>
<ul class="filter option-set clearfix " data-filter-group="color">
<li><a href="#filter-color-any" data-filter-value="" class="selected">any</a>
<li><a href="#filter-color-red" data-filter-value=".red">red</a>
<li><a href="#filter-color-blue" data-filter-value=".blue">blue</a>
<li><a href="#filter-color-yellow" data-filter-value=".yellow">yellow</a>
</ul>
</div>
и собственно то, что мы фильтруем:
<div id="container" class="clearfix">
<div class="color-shape small round red"></div>
<div class="color-shape small round blue"></div>
<div class="color-shape small round yellow"></div>
</div>
есть ява
$(function(){
var $container = $('#container'),
filters = {};
$container.isotope({
itemSelector : '.color-shape',
masonry: {
columnWidth: 80
}
});
// filter buttons
$('.filter a').click(function(){
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'
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 ] )
}
var selector = isoFilters.join('');
$container.isotope({ filter: selector });
return false;
});
});
соль в том, что выбирается всего один парметр в меню, а хотелось бы, чтобы можно было выбирать несколько.... буду очень благодарен за помощь.
Я мог неправильно выразиться, немного не правильно описать то что мне нужно, в силу своей не грамотности, заранее извиняюсь
С уважением Станислав.
Заранее спасибо!
