2017-07-19 9 views
0

私は画像グリッドを持っており、モバイルビュー(320 X 480)には、「もっと読み込む」ボタンがあります。コンテナdivは次のようになります。ajaxコールで追加されたアイテムに石積みを適用する方法

ボタンをクリックすると、ajax呼び出しがトリガーされます。受信した結果は、多くのそのようなグリッドアイテムのHTML文字列である:

"<div class=\"grid-item\">imagex<div> 
<div class=\"grid-item\">imagey<div> 
..." 

容器に文字列を付加した後、私は、メーソンリーをリロードするjQueryのコードを持っているが、すべての画像が重なっています。 htmlをチェックすると、すべてのアイテムに石工CSSが適用されます。石工V4.1.1を使用して

function GetNextSet() { 
      jQuery.ajax({ 
       url: "/api/sitecore/Moment/GetNextSet", 
       type: "POST", 
       context: this, 
       success: function (data) { 
        ShowNextResultSet(data); 
       } 
      }); 
     } 

function ShowNextResultSet(data) { 
    var $content = jQuery(data.ResultSet); 
    jQuery("#divMoments").append($content).masonry('appended', $content); 
    jQuery("#divMoments").masonry('reloadItems'); 
    jQuery("#divMoments").masonry(); 
} 

enter image description here

答えて

0

再適用遅延は私のために働いた後、石工を。

function ShowNextResultSet(data) { 
    var $content = jQuery(data.ResultSet); 
    jQuery("#divMoments").append($content).masonry('appended', $content); 

    setTimeout(function() { 
    jQuery("#divMoments").masonry('reloadItems'); 
    jQuery("#divMoments").masonry(); 
    }, 100); 
} 
関連する問題