Question

我正在wordpress网站上工作并尝试使用砌体实现infinte滚动。

相关网页在这里 - http://bc.somethingdoing.com/bristol-pubs-bars/?tag=pubs-2

当您向下滚动到页面底部以引导infinte滚动时，您应该看到新图像加载旧图像。

目前这有点儿马车，但我不确定如何阻止在existign图像背后加载新图像

我正在使用的Javascript（JQuery）（在functions.php中）就在这里 -

 var infinite_scroll = {
                loading: {
                        img: "<?php echo get_template_directory_uri(); ?>/images/ajax-loader.gif",
                        msgText: "<?php _e( 'Loading the next set of posts...', 'custom' ); ?>",
                        finishedMsg: "<?php _e( 'All posts loaded.', 'custom' ); ?>"
                },
                "nextSelector":"#nav-below  a",
                "navSelector":"#nav-below",
                "itemSelector":".post",
                "contentSelector":"#masonry-container",
        };
        jQuery( infinite_scroll.contentSelector ).infinitescroll( infinite_scroll,// call Masonry as a callback
                function( newElements ) {
                        console.log(newElements);
                        var $newElems = jQuery( newElements ).css({ opacity: 0 });
                        // ensure that images load before adding to masonry layout
                                $newElems.imagesLoaded(function(){
                                console.log('imagesLoded');
                                // show elems now they're ready
                                $newElems.animate({ opacity: 1 });
                                jQuery('#masonry-container').masonry( 'appended', $newElems, true );
                                });
                }
        );

我不确定它是刚刚破坏的CSS，错放的库等。目前没有收到任何Javascript错误，在Chrome和FF中查看网站，没有任何乐趣。

希望这足以看出错误。

任何帮助非常感谢。

干杯

Answer 1

它在砌体脚本中出错，当第二个图像加载时，砌体无法安排它。所以图像不能放在旧图像下面。砖石中的错误。

无限滚动/砌体第二组图像出现在第一组后面

1 个答案: