Paulirish infinite scroll not working on my custom tumblr theme

Question

I'm making a custom tumblr theme, and I am trying to implement paul irish's infinite scroll plugin.

I really like the way the "simplist" theme by "precrafted" handles it (new posts triggered by a button). And If I understand correctly, it's easy to do.

I added the very newest paul irish minified script from github, the triggered script, and included the latest jquery version.

I set up my code like this:

        <script type="text/javascript">
        $('#content').infinitescroll({
            navSelector  : 'div.navigation',            
            nextSelector : 'div.navigation a:#next',    
            itemSelector : '#content div.entry',
            behavior     : 'twitter'
          },function(newElements){
            $(newElements).find('.photo-slideshow').pxuPhotoset();
        }
        });        
    </script>

(I am also using PXU extended photosets, which work, so I know that is not the problem) and added my navigation div.

It did nothing.

Clicking on the next page actually moved me to the next page, instead of loading content dynamically.

Worse yet, normal infinite scroll didn't even work.

My Test tumblr is here: http://test-theme-one.tumblr.com

And my full html code is here: http://pastebin.com/TRNR6V0U

It's probably some stupid mistake I made, but perhaps someone could show me what I did wrong?

graygilmore graygilmore · Accepted Answer · 2013-07-04T17:41:54

You have an error in you JS:

SyntaxError: Unexpected token }

You'll need to change your code to look like this:

<script type="text/javascript">
$('#content').infinitescroll({
    navSelector  : 'div.navigation',            
    nextSelector : 'div.navigation a:#next',    
    itemSelector : '#content div.entry',
    behavior     : 'twitter'
},function(newElements){
    $(newElements).find('.photo-slideshow').pxuPhotoset();
});        
</script>

You'll notice the difference in the closing tags at the bottom of your infinite scroll function.

Update

Your nextSelector is also incorrect. Right now you have 'div.navigation a:#next' and it should be 'div.navigation a#next' (note the removal of the colon).

Paulirish infinite scroll not working on my custom tumblr theme

1 Answers

Update