동위 원소를 사용하여 다른 제품의 기능과 관련된 여러 타일을 정렬하고 필터링합니다. 일부 타일은 각 제품마다 고유 한 타일과 다른 타일은 공유됩니다. 제품 간을 전환 할 때 적절한 클래스 이름으로 태그가 지정된 타일 만 표시하도록 타일을 필터링하지만 기능별로 각 제품마다 다른 우선 순위가 있으므로이 타일의 순서를 제어하려고합니다. 순서를 제어하는 방법을 구현하지 않으면 마크 업 내에있는 순서대로 나타나므로 첫 번째 제품의 기능이 마크 업의 후속 제품에 대한 첫 번째 타일이됩니다.동위 원소로 정의 된 정렬 순서
저는이 작업을 수행하는 가장 효율적인 방법을 찾으려고합니다. 지금 내가 추가 한 속성의 같은 :
타일
<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});
어떤 이유로, 내가 얻을 수있는 타일이를 따르는 나는 정의했다. 이 작업을 수행하는 더 좋은 방법이 있습니까?