2

MasonryでDjango Endless Paginationを使用しようとしています。

私が抱え続けている問題は、Masonry は最初のページでは問題なく機能しますが、ページに新しいデータが入力されると、Masonry が新しくロードされた要素に適用されないことです。アイテムを追加することを検討しましたが、この場合に役立つとは思いません。

新しい要素がロードされたら、石積みを再初期化する方法はありますか?

他の誰かが同様の問題を抱えているかどうか、そして誰かがその解決策を持っているかどうか疑問に思っていましたか?

4

3 に答える 3

4

誰かが同様の問題を抱えている場合、私は最終的に解決策を見つけました。使ってしまいました.masonry('reload')。endless_on_scroll の後は、リロード関数を再度呼び出す方が簡単です。それは問題を処理します！

于 2013-02-03T11:22:05.830 に答える
1

Django-Endless-Pagination のonCompleted設定にはコールバックがあります。そこで、次の操作を行います。

var masonry = $(myMasonryObject).data('masonry');
if (masonry !== undefined) {
    masonry.reloadItems();
    masonry.layout();
}
于 2013-10-06T17:57:17.777 に答える
0

上記の決定で、いくつかの問題が見つかりました。ページの最後までスクロールすると、いくつかのアーティファクトが表示されました (アイテムが互いに重なっているか、フッターに重なっています)。

画像が読み込まれる前に masonry.reloadItems() を呼び出しているか、他の何かがあり、アイテムがまだ実際のサイズになっていないためだと思います。

この解決策により、この問題を解決できます。

 <script type="application/javascript">
    $.endlessPaginate({
      paginateOnScroll: true,
      paginateOnScrollMargin: 3840,
      onCompleted: function(context, fragment) {
        $(document).ready(function () {
            var gallery = $('.gallery');
            gallery.imagesLoaded(function () {
                var masonry = gallery.data('masonry');
                if (masonry !== undefined) {
                    masonry.reloadItems();
                    masonry.layout();
                }
            });
        });
      }
    });
  </script>
于 2017-11-03T10:33:20.050 に答える