1

ポートフォリオアイテムに石積みを使用しています。ページに直接移動すると、適切な列にタイルが読み込まれます。ただし、私の Web サイトは pjax を使用して読み込まれます。ポートフォリオ ページを読み込むと、ウィンドウのサイズを変更するまで、すべてのポートフォリオ アイテムが 1 つの列に読み込まれます。

そのような石積みは、ajax 要求の後にクライアントの幅を認識せず、ウィンドウのサイズが変更されたときにクライアントから飛び出します。

私が経験していることを知っている石積みの経験がある人はいますか?

4

2 に答える 2

0

ajaxComplete で石積み呼び出しをラップして、ajax が読み込まれた後に起動するようにします。

$( document ).ajaxComplete(function() {
  console.log("Ajax finished"); //remove this if you want, useful for debugging
      $(document).ready(function() {
      $('#content').masonry({
       columnWidth: 260, //change this accordingly
       itemSelector: '.item'
      });
    });
});

自分でこの問題に取り組んだだけです。

ここでより良い解決策:

$(document).ready(function() {
      $('#admin_content').masonry({
       columnWidth: 260,
       itemSelector: '.masonry-item',
       isAnimated:true,
                animationOptions: {
                    duration: 500,
                    easing:'swing',
                    queue :false
               }
      });
    });
$( document ).ajaxComplete(function() {
    $('#admin_content').masonry('reloadItems').masonry();
});
于 2013-09-15T16:22:16.947 に答える