jQuery砌体制作Ajax调用删除类砌体砖

我正在使用jQuery插件砌体和我有一个问题，当我做一个ajax调用另一个页面加载图片的图像时发生。 ajax调用起作用，并且图像加载进来，但是当调用发生时，会发生一些事情，从而删除了Masonry附加的其中一个我的div的类之一。jQuery砌体制作Ajax调用删除类砌体砖

这是我的html在第一页上的外观。这里的一切都很好，并且显示了砌体砖，我需要渲染出适当的css使所有内容看起来不错，同时它也呈现出内联css。

<a href="/system/images/series_uploads/15/original/berkshire_25585_walnut_famousdaves03.jpg?1330115640" rel="lightbox['gallery']"> 
    **<div class="item masonry-brick" style="position: absolute; top: 0px; left: 0px;">**<img alt="" src="/system/images/series_uploads/15/gallery/berkshire_25585_walnut_famousdaves03.jpg?1330115640" title="Berkshire" /> 
    <div class="gallery-text"> 
     <h3>Berkshire</h3> 
     <p>HDP &ndash; High Definition Porcelain</p> 
    </div> 
    </div> 
    </a>

当我点击链接，使AJAX调用，加载图像精细，它适用于所有的链接，但该类砌体砖被删除，图像失去了CSS。

jQuery("#project-galleries-navigation li.load-category a").on("click", function(){  
    var href = jQuery(this).attr("href"); 
      jQuery("#gallery").fadeOut(300).remove("img").load(href).fadeIn(2300);  
     return false;   
    });

这是我用于砌体的代码。

var $container = jQuery('#copy-wrapper-gallery'); 
$container.imagesLoaded(function(){ 
    $container.masonry({ 
    itemSelector : '.item', 
    isAnimated: true    
    }); 
});

这就是当页面加载到新数据中时，我的html发生了什么。砌石砖不再存在，内联css也消失了。

<a href="/system/images/series_uploads/7/original/ashton_23931_smokey_beige_.jpg?1330114250" rel="lightbox['gallery']"> 
    **<div class="item">**<img alt="" src="/system/images/series_uploads/7/gallery/ashton_23931_smokey_beige_.jpg?1330114250" title="Ashton" /> 
    <div class="gallery-text"> 
     <h3>Ashton</h3> 
     <p>Porcelain</p> 
    </div> 
    </div> 
    </a>

有没有人有这个问题或知道一种方法来解决这个问题？

来源

2013-04-23 Jarrod

我能够通过修改这个jQuery并为其添加回调函数来实现它。

  jQuery("#gallery").fadeOut(300).remove("img").load(href, function(){ 
        jQuery("#gallery").masonry("reload"); 
       }).fadeIn(2300);  
       e.preventDefault();      
     });

来源

2013-04-23 17:06:09 Jarrod

jQuery砌体制作Ajax调用删除类砌体砖

回答

相关问题