Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Already on GitHub? Sign in to your account

Keeps on loading posts #449

louisdalligos opened this Issue Nov 29, 2013 · 1 comment


2 participants


I've got a site here: http://chimera.cheriomedia.com/

Keeps on loading the last remaining posts in a loop. I'm using a trigger/append to load new posts. Here's my code:

var $timelineContainer = $('.timeline-container');
if ($timelineContainer.length > 0 ) {
    $timelineContainer.imagesLoaded(function() {
                itemSelector: '.post',
                hiddenStyle: { opacity: 0 },
                visibleStyle: { opacity: 1 },
                transitionDuration: '0.5s'

      $timelineContainer.masonry('on', 'layoutComplete', function() {
var $loadMorePosts = $('.js-load-more-posts');
  var $spinner = $('<span class="ajax-spinner"></span>');
  var archivePosts = $('.older-posts').attr('href');

  $loadMorePosts.on('click', function(e) {

    // If there are posts to get
    if (archivePosts !== undefined) {

      $.get(archivePosts, function(result) {
        var $html = $(result);
        var $newContent = $('.js-timeline-container', $html).contents();


        $timelineContainer.imagesLoaded(function() {
          $timelineContainer.masonry('appended', $newContent);

        // Set up the load more button after the layouts complete
        $timelineContainer.masonry('on', 'layoutComplete', function() {
          // Get the url for more posts
          archivePosts = $('.older-posts', $html).attr('href');

          // Inform the user if there are no more posts
          if (archivePosts === undefined) {
            $loadMorePosts.text('No More Posts');
          } else {
            $loadMorePosts.text('Load More');

Any help would be appreciated! Thanks!


desandro commented Nov 29, 2013

Sounds like this is related to how you are loading more content, not necessarily how Masonry is being used. I would disable use of Masonry and focus just on getting the 'load more' functionality resolved.

Also, this looks problematic:

$timelineContainer.masonry('on', 'layoutComplete', function() {

I would add return true in that function so you're only binding the event once per each load

@desandro desandro closed this Nov 29, 2013

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment