Rebinding infinitescroll plugin with new URL link on click
so i have a case like this, i want to rebind infinite scroll plugin on a
clicked link and passing new URL to differ the content section that'll be
generated later by it..
So far what i can do is triggering the infinite scroll and passing the
section at the first clicked link.. after that when i clicked another link
the URL link or the section won't be rebinded, i want it to be rebinded so
it can differ the generated content.
moreless here's my code..
HTML
<li class="active"><a href="#" title="" data-filter=".w-all"
class="w-filter">View All</a></li>
<li><a href="#" title="" data-filter=".w-branding"
class="w-filter">Branding</a></li>
<li><a href="#" title="" data-filter=".w-graphic"
class="w-filter">Graphic</a></li>
<li><a href="#" title="" data-filter=".w-website"
class="w-filter">Website</a></li>
<li><a href="#" title="" data-filter=".w-photography"
class="w-filter">Photography</a></li>
jQuery
$('a.w-filter').click(function(e){
var selector = $(this).attr('data-filter');
var section = selector.split('-');
$('#page_nav a').attr('href', 'pager/1/'+section[1]);
$(window).unbind('.infscr');
$container.infinitescroll({
navSelector : '#page_nav',
nextSelector : '#page_nav a',
itemSelector : '.item',
loading: {
finishedMsg: 'Hmm, I guess that\'s all we got.',
img: 'loading.gif',
msgText: '<em>Loading more projects.</em>'
},
pathParse: function (path, currentPage) {
var chunkedUrl = ['/pager/', '/'+section[1]];
return chunkedUrl;
}
});
$container.infinitescroll('retrieve');
e.preventDefault();
});
can it be done?
No comments:
Post a Comment