# infinite scroll not triggering

I am attempting to use the infinite scroll scripts located here:

http://iamjustinlong.com/blog/single/implementing_infinite_scroll_in_your_expressionengine_site/

I have followed this pretty much word for word, but it is not working and I am running out of time to get it to work. Below is my code:

SNIPPET:

    <div class="col" id="#blog-container">
{exp:channel:entries
channel="blog"
dynamic="no"
orderby="date"
limit="2"
status="open|tall|regular"
paginate_base="_embed/ajax_scroll"
}

{if no_results}
<div class="entry">
<article style="min-height: 600px;">
Check back soon for more blog posts.
</article>
</div> <!-- /.entry -->
{/if}
<div class="entry">
<article>
<p class="meta">
<span class="category">{categories}{category_name}{/categories}</span> / <span class="date">{entry_date format="%F %d, %Y"}</span>
</p>
<h1><a href="{url_title_path='blog/details'}">{title}</a></h1>
<img src="{blog_image}" alt="">
{blog_excerpt}&nbsp; &nbsp; &nbsp; <a href="{url_title_path='blog/details'}" style="display: inline-block;">read more</a>
</article>
</div> <!-- /.entry -->

{paginate}
<p class="morePosts">
</p>
{/paginate}
{/exp:channel:entries}
</div> <!-- /.col -->


BASE CODE:

{snip_ajax_scroll}
<script type="text/javascript" src="{site_url}assets/js/jquery.infinitescroll.js"></script>
<script type="text/javascript">
$(document).ready(function(){$('#blog-container').infinitescroll({
navSelector : "p.morePosts",
nextSelector : "a.more",
itemSelector : ".entry",
contentSelector: "#blog-container",
extractLink: true // This is crucial if you want it work properly. Setting this to false or excluding it will not allow the script to work with EE
})

});

// Unbind normal behavior
$(window).unbind('.infscr'); // Bind normal behavior to the click function and prevent the browser from redirecting to the URL.$('a#next').click(function(){
\$(document).trigger('retrieve.infscr');
return false;
});

</script>


I have used console.log at different parts of the js to see if the scripts are firing and I get a message for all the blocks above except for the click function on a#next. This seems to die.

Let me know if there are any other code items you need and thanks in advance for any help!

• In your snippet you have <div class="col" id="#blog-container"> you should not have a # as part of a class or id try changing it to <div class="col" id="blog-container"> – Justin Long Jun 25 '13 at 1:42