3

http://isotope.metafizzy.co/docs/help.html言います:

最初のアイテムが組積造のレイアウトを壊す

Masonry レイアウト モードの場合 最初のアイテムのサイズを変更し、残りのすべてのアイテムがグリッドに収まらないという問題が発生した場合は、おそらく columnWidth オプションを設定する必要があります。columnWidth が設定されていない場合、Masonry レイアウト モードは最初の項目の幅を列のサイズとして使用します。

$('#container').isotope(
  masonry: {
    columnWidth: 220
  }
});

そして、これが私が現在行っていることです。ただし、columnWidth を変更する CSS メディア クエリがいくつか必要です。したがって、最初の Isotope-item が通常の 1x 幅である場合、CSS で項目の幅を指定するだけで、Isotope はそこから columnWidth を取得して機能します。しかし、最初の項目の幅が 2 倍であるため、上記のコードのように列の幅を指定する必要があり、もちろん CSS で変更することはできません。

たとえば、次のことが可能ですか。

  • 幅が 1 倍の 2 番目の項目から同位体に columnWidth を取得させますか?
  • ある種のハックを作成して、実際には最初のアイテムとして 1x 幅のアイテムを持ちますが、display:none または何かで非表示に設定しますか?
  • Isotope columnWidth を設定して、最初の項目の幅 (幅の 2 倍) から 10px を引いて 2 で割りますか?
4

2 に答える 2

0

isotope jquery プラグイン v2.2.2 を使用していますが、その問題に直面しました。私はcssを追加しましたが、それは私にとってはうまくいきます。

.itl-portfolio-masonry:after {
    content: '';
    display: block;
    clear: both;
}
于 2016-02-11T20:11:25.560 に答える