LazyLoad Plugin

I am using jQuery Lazy Load to load thumbnails on a page I have a list of about 100+ thumbnails per page. This plug-in works perfect, until I introduce the plug-in Quick Pagination to display nine thumbnails at a time and give users the next and previous.

When one clicks on the Next or Previous, you get the gray placeholder image as the page Scroll is no longer a factor.

I tried different events and even created my own, this only loads all thumbnails even the ones below the threshold in the (next and previous).

Is there away to trigger the scroll event? Like this person has done > http://blog.3circlestudio.com/development/how-to-use-lazy-load-with-easy-slider-1-7/

I did try this as well and no luck.

$('.thumbs').lazyload({ placeholder:'/thumbnail.gif' });

Without Quick Pagination and scrolling the about works!

$('#thumbnails').paginate({ pager: $('div#pagination') });

Introducing the paginate works to generate a list of 9 thumbnails per, breaks lazyload. I guess what I am asking and开发者_StackOverflow can not figure out is how to call the thumbnails each time I click on the Next link.

---

I just figured it out and it is working! I created a function within in Quick Pagination when the Next and Previous are called. In this function I inserted the following.

var scrollTop = function() {
    $('html, body').animate({scrollTop:0}, 'slow', function() {
        $(window).trigger('scroll');
    });
}

By placing the animate along with scroll top I fixed the issue to scroll the page, and by place $(window).trigger('scroll'); within the animate it triggers the scroll and loads the next set of photos. Hope this makes sense to anyone else - for my end it is working.

Yes!

---

I think these 2 plugins are diametrically opposed. I suggest using lazyload and the scrollto plugin. This should get you what you are looking for, just make sure to call the lazyload as follows

$('thumbs').lazyload({
    placeholder:'/thumbnail.gif',
    container:$('#thumbnails')
});

---

jquery LazyLoad plugin doesn't work for me on FF3.6. If i inspect the demo page with Firebug I can see that all the images are loaded onload.

You can check out this plugin called JAIL that works perfectly (there are few examples). I suggest to keep the Net tab of Firebug open when you open the examples pages.

---

as found here: https://stackoverflow.com/a/17171241/891052 use this to trigger lazyload

$(window).resize();