jQuery砌体-砌体重新加载后调用方法

jQuery masonry - call method after masonry reload

本文关键字:加载 方法 调用 新加载 砌体 jQuery      更新时间:2023-09-26

我使用Twitter Bootstrap和jQuery Masonry来开发一个新网站。我将新的元素添加到砖石的容器中。

这些元素既没有附加到现有的子元素,也没有前置到它们之间,而是插入在它们之间,这取决于这样的排序顺序:

var elem = $(boxes[rand2]);
$(".post").each(function(i){
    if(parseFloat($(this).data("weight"))<=weight){
        elem.insertBefore(this);
        return false;
    }
    else if (i == $(".post").length - 1) {
        elem.insertAfter(this);
        return false;
    }
});

到目前为止,这是完美的。我想实现的是,元素只有在到达目的地时才会显示。我不想禁用动画,但新元素的空间应该出现(空),只有当所有东西都通过砖石重新排列时,新元素才会出现。

我以为会有一个回调操作,在重新加载后触发,如下所示:

$('#posts').masonry('reload',function(){
  alert('re-aligning finished');
});

但这不起作用,它很早就开始了。

所以现在,我做了

$('#posts').masonry('reload',function(){
  window.setTimeout(showElem,500);
});
function showPosts(){
  $('.post').show();
}

这似乎奏效了,但固定的500毫秒超时并不是一个真正漂亮的解决方案。。。

那么,有什么建议吗?

我猜您已经在使用jQuery了。也许使用延迟对象是有用的。

您能在文档加载后再做吗?

(function($) {
$(document).ready(documentReadyFunction);
$(window).resize(windowResizeFunction);
$(window).load(windowLoadFunction);
function documentReadyFunction() {
    //your inserted html here
}
function windowResizeFunction() {
    //resize here
}
function windowLoadFunction() {
    //do masonry here
}
})(jQuery);