Question

我一直试图让Packery和infinitescroll jquery插件工作，但由于某种原因，新元素出现在彼此之上。

我被引导到imagesloaded插件，但由于某种原因，它似乎将元素叠加在一起。我为jQuery 1.9（https://github.com/lukeshumard/smartscroll/pull/2）应用了Smart Scroll插件的修复程序，但是，我认为问题在于imagesloaded和packery。

我的脚本如下所示：

    $(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或codepen。

Answer 1

Chrome Canary似乎存在问题，因为它正在其他浏览器中运行......

Packery + Infinitescroll + imagesLoaded =无法正常工作

1 个答案: