所以我为我的filtred组合运行这个代码,我需要在过滤结果的每个第二个元素中添加class。这是我到目前为止所尝试的(没有运气)。好的,我知道这很简单,但有些我不能让它发挥作用!
HTML
<button class="btn btn-default filter-button" data-filter="all">All</button>
<button class="btn btn-default filter-button" data-filter="hdpe">HDPE Pipes</button>
<button class="btn btn-default filter-button" data-filter="sprinkle">Sprinkle Pipes</button>
<div class="gallery_product col-lg-4 col-md-4 col-sm-4 col-xs-6 filter hdpe">
<img src="http://fakeimg.pl/365x365/" class="img-responsive">
</div>
<div class="gallery_product col-lg-4 col-md-4 col-sm-4 col-xs-6 filter hdpe">
<img src="http://fakeimg.pl/365x365/" class="img-responsive">
</div>
<div class="gallery_product col-lg-4 col-md-4 col-sm-4 col-xs-6 filter sprinkle">
<img src="http://fakeimg.pl/365x365/" class="img-responsive">
</div>
<div class="gallery_product col-lg-4 col-md-4 col-sm-4 col-xs-6 filter sprinkle">
<img src="http://fakeimg.pl/365x365/" class="img-responsive">
</div>
JQUERY
// PROJECT FILTERS
$('.filter-button').click(function(){
var value = $(this).attr('data-filter');
if(value == 'all')
{
$('.filter').show('1000');
}
else
{
$('.filter').filter('.'+value).removeClass('even').removeClass('odd').removeClass('visible');
$('.filter').not('.'+value).hide('3000');
$('.filter').not('.filter[filter-item="'+value+'"]').removeClass('visible');
$('.filter').filter('.'+value).show('3000');
$('.filter').filter('.'+value).addClass('visible');
$( ".visible" ).filter( ":even" ).css( "background-color", "red" );
//$( ".visible" ).filter( ":even" ).addClass( "even" );
}
});
if ($('.filter-button').removeClass('active')) {
$(this).removeClass('active');
}
$(this).addClass('active');
代码用于上面的示例 https://bootsnipp.com/snippets/featured/portfolio-gallery-with-filtering-category
感谢Advane的意见和帮助
答案 0 :(得分:1)
这可以从下面的按钮运行:运行代码段
someValue