Javascript 派克+；无限滚动+；imagesLoaded=不工作

我一直在尝试让Packer和infinitescroll jquery插件工作，但是由于某种原因，新元素出现在彼此的顶部

我被引导到imagesloaded插件，但是出于某种原因，它似乎覆盖了一个又一个元素。我为jQuery1.9（）的智能滚动插件应用了一个修复程序，但是，我相信问题在于imagesloaded和Pacery

我的脚本如下所示：

    $(document).ready(function() {

        // declaring variables
        var $sidebar        = $("#sidebarHolder"),
            $sidebarwidth   = $sidebar.width(),
            $window         = $(window),
            $windowheight   = $window.height(),
            $offset         = $sidebar.offset(),
            $topPadding     = $("#sitewide").height(),
            $container      = $('#container.clearfix');

        // making sure the sidebar stays the right size when it's resized
        $(window).on("resize",function () {
            $("[role=sidebar]").width($sidebarwidth).show();
            $("#sidebarHolder,[role=sidebar]").height($windowheight + 20);
        }).resize();

        // scroll 'stick to the top' function
        $(window).on("scroll",function() {
            if ($window.scrollTop() > $offset.top) {
                $sidebar.addClass('sticky');
            }else{
                $sidebar.removeClass('sticky');
            }
        }).scroll();

        $container.packery({
            itemSelector:'article.item',
            columnWidth:"div.grid-sizer",
            rowHeight:"div.grid-sizer",
            gutter:"div.gutter-sizer",
            transitionDuration:'0.2s'
        });

        $container.infinitescroll({
            navSelector:'div.paginate',
            nextSelector:'div.paginate a.next',
            itemSelector:'article.item',
            loading:{
                finishedMsg:'No more pages to load.'
            }
        },
        function(newElements) {
            $(newElements).imagesLoaded(function(){
                $container.packery('appended', newElements);
            });
        });

    });

任何帮助都将不胜感激

---

如果有必要，我可以设置jsbin或代码笔。

Chrome Canary似乎有问题，因为它在其他浏览器中工作