プロジェクトのテンプレートのリストをソートするために同位体フィルターを使用しています。ユーザーは、列幅 (2 列、3 列、4 列) やタイプ (テキスト、画像、ビデオ) などに基づいてフィルター処理することを選択できます。他にもオプションがありますが、これにより例が単純になります。
フィルタが現在機能する方法は、項目がすべてのフィルタ オプションに一致する必要があるということです。1 つ以上のフィルター オプションに一致するアイテムをフィルターできるようにしたいと考えています。
二次的な質問: 段階的にフィルタリングできる機能はありますか? たとえば、2 列または 3 列のすべてのテンプレートを表示し、それらの結果をテキストとビデオのテンプレートのみにフィルター処理できたとします。
これはプラグインの範囲外である可能性があり、独自のフィルターを作成するか、別のプラグイン (少なくともフィルタリング用) を見つけるか、ユーザーへのフィルタリングの表示方法を変更する必要があるかもしれません。
col2、col3、col4、テキスト、画像、ビデオなど、フィルタリングに使用しているさまざまなクラスが適用されており、現在、「.col2.image」の行に沿ってフィルター文字列を作成していると仮定します。 2 列にまたがる画像である要素。それらをコンマで区切ることで、OR フィルター ('.col2, .image') を取得し、画像または 2 つの列にまたがるものをすべて表示します。
まず、2 番目の部分でこれらを組み合わせて、「.col2.text、.col2.video、.col3.text、.col3.video」のようなフィルターを作成できますが、これは特にあなたがカテゴリ数を増やします。
簡単にするために、Isotope を変更してフィルターの配列を受け入れ、それらを複数のフィルター呼び出しでチェーン化しましたが、文字列ではなく、より複雑なフィルター オブジェクトを渡すこともできるようです (https://github .com/desandro/isotope/issues/144#issuecomment-4595552) により、Isotope のソースを変更する必要がなくなります。上記の例では、これは次のようになります。
$('.element').filter('.col2, col3').filter('.text, .video')
これは、可能な組み合わせの文字列を生成するよりもはるかに簡単です。
.filter のドキュメント (http://api.jquery.com/filter/) には、高度なフィルタリングの詳細が記載されています。
ここに示すように、さまざまな組み合わせを簡単にフィルタリングできますhttp://jsfiddle.net/3nY9V/