Question

I'm getting an error for infinite scroll in my tumblr blog.

Uncaught SyntaxError: Unexpected token < jquery.infinitescroll.min.js:6
Uncaught TypeError: Object [object Object] has no method 'infinitescroll' 

The thing is, I haven't changed the code at all. It worked fine before I accidentaly deleted all of the .js from my server. Now after I reuploaded the files, it doesn't want to work.

console.log(jQuery.infinitescroll);

returns "undefined".

 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

    <script src="http://www.gamepad.lt/tumblr/js/masonry.pkgd.min.js"></script>
    <script src="http://www.gamepad.lt/tumblr/js/imagesloaded.pkgd.min.js"></script>
    <script src="http://www.gamepad.lt/tumblr/js/jquery.infinitescroll.min.js"></script>
     <script>
    $(document).ready(function() {
        console.log(jQuery.infinitescroll);
        var clHolder = $('#loader-holder'),
        clBubble = $('#bubble'),
        clX = 0, clY = 0, clD = 0,
        clEngaged = true, clInterval;

        function clFunc(){
            clX = Math.round(37 + Math.cos(clD * Math.PI / 180) * 53);
            clY = Math.round(37 + Math.sin(clD * Math.PI / 180) * 53);
            clBubble.css({'top' : clY, 'left' : clX});
            clD = clD + 10;
            if(clD >= 360){clD = 0;}
        }

        if(clEngaged){clInterval = setInterval(function(){clFunc();}, 30);}
        setTimeout(function () {
           clearInterval(clInterval);
           clEngaged = false;
           $('#posts').animate({opacity : 1}, 1000);
        }, 5000);

        var $container = $('#posts');
        var $logo = $('<li class="post logo"><h1><a href="/"><img id="header" src="http://static.tumblr.com/pgmq7uc/5Y1mt16m1/kawaiiandecchi.png"/></a></h1></li>');
        $container.prepend($logo);
        $container.imagesLoaded(function(){
            $container.masonry({
                columnWidth: '.post',
                "gutter": 10,
                transitionDuration: 0,
                itemSelector: '.post'
            });
            clEngaged = false;
            clHolder.animate({opacity : 0}, 1000, function(){
                clearInterval(clInterval);
            });
            $('#posts').animate({opacity : 1}, 1000);
        });

        $("#backToTop").click(function(){
            $("body").animate({scrollTop: '0'},500);
        });

        $container.infinitescroll({
            navSelector  : '#page-nav',
            nextSelector : '#page-nav a', 
            animate : false,
            itemSelector : '.post',
            donetext     : $container.prepend($logo),
            bufferPx     :  50,
            loading: {
              finishedMsg: ''
            }
          },
          function( newElements ) {
            var $newElems = $( newElements );
                $newElems.css({opacity : 0});
            $newElems.imagesLoaded(function(){
                $container.masonry( 'appended', $newElems, false ); 
                $newElems.css({opacity : 1});
            });
          }
        );

        $('#infscr-loading').remove();

        function sortUnorderedList(ul, sortDescending) {
          if(typeof ul == "string")
            ul = document.getElementById(ul);

          var lis = ul.getElementsByTagName("LI");
          var vals = [];

          for(var i = 0, l = lis.length; i < l; i++)
            vals.push(lis[i].innerHTML);

          vals.sort();

          if(sortDescending)
            vals.reverse();

          for(var i = 0, l = lis.length; i < l; i++)
            lis[i].innerHTML = vals[i];

          $('#menu').animate({opacity : 1}, 1000);
        }

        sortUnorderedList("menu", false);
    });
    </script>
Was it helpful?

Solution

You are missing infinite scroll plugin.

You do include it in your header:

<script src="http://www.gamepad.lt/tumblr/js/jquery.infinitescroll.min.js"></script>

However this link does not contain the jQuery code for the plugin (!):

http://www.gamepad.lt/tumblr/js/jquery.infinitescroll.min.js

Update the file with the code for infinite scroll plugin.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top