我正在使用同位素对与不同产品的功能相关的多个图块进行排序和过滤。某些图块对于每个产品都是独一无二的,而其他图块是共享的。当您在产品之间切换时,它会过滤磁贴以仅显示标记有适当类名的磁贴,但是,我想控制这些磁贴的顺序,因为每个产品的功能具有不同的优先级。如果我不实施任何控制顺序的方式,它们会按照它们在标记中的顺序出现,这意味着第一个产品的功能将成为标记中后续产品的第一个图块。
我试图找出最有效的方法来做到这一点。现在我已经添加了这样的属性:
瓷砖
<div id="feature1" class="isotope-item productA productB" productAOrder="1" productBOrder="2">
Feature 1
</div>
<div id="feature2" class="isotope-item productA productB" productAOrder="2" productBOrder="1">
Feature 2
</div>
jQuery/同位素代码
$container.isotope({
getSortData: {
productA: function ($elem) {
return parseInt($elem.hasClass('productA').attr('productAOrder').text(), 10);
},
productB: function ($elem) {
return parseInt($elem.hasClass('productB').attr('ProductBOrder').text(), 10);
}
}
});
$container.isotope({ filter: '.productA'});
$container.isotope({ sortBy: 'productA', sortAscending : true});
无论出于何种原因,我都无法让瓷砖遵循我定义的顺序。有一个更好的方法吗?