完全に応答ソリューション+フィルタリングと検索/アイソトープで石工を組み合わせる方法:ワット私は以下のコード作成した
http://codepen.io/dkpen/pen/dppoKj?editors=0110
これは完全に応答性であるが、私の実際の石積みソリューションでIsotopeフィルタリングを動作させるための回避策でした。それはアイソトープの余分なオプションにあるlayout none
の解決策を介して行い、元の石積みコード(上記のペンリンクのJSセクションの一番下)を追加することで実現できます。
問題は、私がデータをフィルタリングするときに、が私の実際の.box
divに追加されていないと思われます。そのため、Masonryが初期化されたときにフィルタリングされたデータは再構成されません。どのように私はそれを解決することができます任意のアイデアをお持ちですか?多分私の石積みのコードを同位体レイアウトのオプションに組み合わせたり置いたりするのでしょうか?しかしその後、このスニペットは私のために働いていなかった。依頼された場合、私は使用
columnWidth: function(containerWidth) {return containerWidth/4;}
他のソースはコメント欄を通じて配信されます。
+1興味深い://レイアウトモードではない位置のアイテム
Isotope.LayoutMode.create('none');
をして、私はmasonry
にnone
を変更した場合、アニメーションだけで、しかし、(うまくデータをフィルタリングし、再び展開を開始しません再編成はまだ動作しません)
リンク: http://codepen.io/desandro/pen/mCdbD http://codepen.io/desandro/pen/AEslp –
なぜあなたがしたいと思いますisotopeが石積みのレイアウトを持っていて、すでにフィルタリングと並べ替えが組み込まれていて検索が簡単に統合されている場合は、これを行います。 – Macsupport