固定幅の外部コンテナで Isotope (または Masonry) を使用する方法を見つけることができませんでした。
それは常にサイズ変更を主張します。オプション、コード、グーグル、ここを調べましたが、答えが見つかりませんでした。
それは可能ですか?
固定幅の外部コンテナで Isotope (または Masonry) を使用する方法を見つけることができませんでした。
それは常にサイズ変更を主張します。オプション、コード、グーグル、ここを調べましたが、答えが見つかりませんでした。
それは可能ですか?
あなたの質問は、私が抱えていた問題に逆行しているようです。Masonry は流動的なコンテナーで最適に機能しますが、中心に 980px の固定幅が必要でした (メイン クラス ie: margin:0 auto; width 980px; )
次に、石積みが機能しません...修正は、すべてのコンテンツを設定された幅に含めるために使用する中心またはクラスを見つけ、幅から最大幅:980pxに変更することです。これは、引き続き固定幅の中央のコンテナを使用していることを意味しますが、ブラウザのサイズを変更すると、石積みのアイテムが再調整/再レイアウトされます。
私は www.digi2020.com で取り組んでいるモジュールを持っています - メニュー -> ポートフォリオを選択すると、それがまさにこれを行うことがわかります。私は多くのベルとホイッスルを追加しましたが、メーソンリーへの単純な呼び出しでも同じ効果が得られます。
そのページの .main クラスと JavaScript を調べてチェックアウトします。
サイズ変更時にアイテムを再レイアウトすることはできませんが、フィルタリングを提供する固定幅でアイソトープを使用する別の例は、pressedweb.com/portfolio で見つけることができます。
通常、これは外側のコンテナを に設定したときに発生しますmax-width
。私は使用width:960px
しましたが、ブラウザー ウィンドウのサイズを変更した後、石積みのグリッドに干渉しません。外側のコンテナをすべてチェックしてみてはいかがでしょうか。