0

何らかの理由で、私のjquery masonryはcol1とcol2を別々に扱いますが、CSSでは同じです(色とマージン以外)。

  $(document).ready(function() {
        $('#container').masonry({
            columnWidth:800
        });

$('#container').masonry({
            itemSelector: '.col1',
            columnWidth: 150
         });

        $('#container').masonry({
            itemSelector: '.col2',
            columnWidth: 150
        });
});

Col2 はチェッカーボードのように右側にあり、col1 のすぐ下にあります。コード付きの JSfiddler へのリンクを次に示します。なぜこれがそのような結果になるのか誰にもわかりますか? この例の JS Fiddler コード ありがとう、アーガイル

4

1 に答える 1

0

これは、3 つの列があり、各列にレンガが 1 つしかない場合は正常です。1 つまたは 2 つの変数を与えるだけで難しい数学の問題を基本的に解決するプログラムに何を期待しますか? それは解決策ですが、おそらく最善ではありませんか？各コンテナーにブロックを追加してみてください。アルゴリズムがどのように問題を解決するかがわかりますか?

要求に応じて、石積みのドキュメントと私の回答をもう一度読むことをお勧めしますが、石積みアルゴリズムをメインコンテンツに追加するだけの場合は、各レンガには必要ありません。

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

    $('#container').masonry({
        itemSelector: '.col1',
        columnWidth: 150
     });

    $('#container').masonry({
        itemSelector: '.col2',
        columnWidth: 150
    });

     $('#container').masonry({
        itemSelector: '.col3',
        columnWidth: 150
    });

1回追加するだけで、すべてのブリックに1つのセレクターがあるように変更できます。たとえば:

   $('#container').masonry({
        itemSelector: '.main',
        columnWidth: 150
    });
于 2012-07-24T23:47:33.250 に答える