砌体和 JQuery 重装

Question

我在尝试为我的用户创建时间轴效果的项目中使用 http://masonry.desandro.com 的 Masonry。

我想经常自动刷新页面（10 秒用于测试），但运行遇到了问题。在第一次加载时，它调用 getStatus() 函数，页面加载完美。但是 10 秒后数据重新加载并且 masory 被破坏了。

我想我尝试了关于何时调用和调用库的所有组合，但似乎没有任何效果。任何想法如何让砌体每次都能处理重新加载的内容。当新数据（HTML）传送到页面时，基本上正确地重建自身？我知道我做错了，但这是我的脚本块中的内容。

<script>
container = document.querySelector('#timeline-list');
        msnry = new Masonry( container, {
            // options
            columnWidth: '.col-sm-6',
            itemSelector: '.col-sm-6'
        });
        function getStatus() {
            $.getJSON('/community/get_status', function(data) {
                $('div#timeline-list').html(data.content);
                    msnry = new Masonry( container, {
                        // options
                        columnWidth: '.col-sm-6',
                        itemSelector: '.col-sm-6'
                    });
            });


            setTimeout("getStatus()",10000);
        }

        jQuery(window).load(function(){
            getStatus();
            if(jQuery(window).width() <= 640 ){
            msnry.destroy();
        }

            // check on resize
            jQuery(window).resize(function(){
                if(jQuery(this).width() <= 640 )
                    msnry.destroy();
            });

        });
    </script>

重新加载函数 returns HTML 中的所有 col-sm-6 div 和数据。

我已经尝试过 .layout 和 .reloadedItems，但它们似乎都不起作用（或者它们告诉我的存在。有什么想法吗？谢谢！

Answer 1

你能用 "broken" 说得更具体些吗？也许你需要使用 ImagesLoaded Masonry

如果我没记错的话，现在它是一个独立的图书馆Images Loaded Source

砌体和 JQuery 重装

Masonary and JQuery reloading

html

javascript

php

jquery

masonry