2014-10-27 93 views
0

我想在我的网站上设置无限滚动的日子。 最后我发现了一个几乎可以工作的插件 - jetpack设置无限滚动

问题:当您向下滚动时,新加载的帖子被放在显示的顶部。

解决?解决方案见回答

我们如何解决这个问题?

解决方案建议?也许这与我的主题使用java-masonry进行网格显示有关,而我发现this tutorial page提供了代码片段来处理这个问题。

也许我让他们错了?

我在functions.php的底部添加了这个入队的脚本和配置喷气背包

// Jetpack infinite js addon 
 

 
wp_register_script('ininite-addon', (get_template_directory_uri()."/js/infinite-addon.js"),'infinite-addon',false,true); 
 
\t \t \t 
 
wp_enqueue_script('infinite-addon'); 
 

 

 
    // Jetpack infinite scroll 
 

 
add_theme_support('infinite-scroll', array(
 
    'container' => 'post-area', 
 
    'footer' => 'footer', 
 
    'wrapper'  => false, 
 
    'posts_per_page' => '7', 
 
));

,这是我创建的名为无限的插件文件。 js根据上面提到的教程:

jQuery(document).ready(function($) { 
 
    infinite_count = 0; 
 
    // Triggers re-layout on infinite scroll 
 
    $(document.body).on('post-load', function() { 
 
\t infinite_count = infinite_count + 1; 
 
\t var $container = $('#content'); 
 
\t var $selector = $('#infinite-view-' + infinite_count); 
 
\t var $elements = $selector.find('.hentry'); 
 
\t $elements.hide(); 
 
\t $container.masonry('appended', $elements, true); 
 
\t $elements.fadeIn(); 
 
    }); 
 
});

谢谢你这么多的任何帮助!让我知道如果你需要更多我的代码!

回答

0

解决了这个问题。 我发现/载有下列代码中调用我的主题的/ JS funtions.js文件目录,显然是使砌筑工作:

$(document).ready(function() { 
 
    $('#post-area').masonry({ 
 
    // options 
 
    itemSelector : '.post', 
 
    // options... 
 
    isAnimated: true, 
 
    animationOptions: { 
 
    duration: 400, 
 
    easing: 'linear', 
 
    queue: false 
 
    } 
 
\t 
 
    }); 
 
});

我只是删除这一点,并用它代替上面的代码片段,现在它像魔术一样工作!