Lazy Loading in Flexslider

Question

I am trying to get lazy loading working for Flexslider by using Lazy Loading jquery plugin and following the instructions on this site: http://www.appelsiini.net/projects/la

Answer 1

You might as well initialize lazyload with a custom trigger event ...

$jQ("img[data-original]").lazyload({
            effect: "fadeIn",
            skip_invisible: false,
            event: "forceLazyLoad"
        });

... and then call this event to preload all your images inside the flexslider with a call like:

$jQ('.flex-viewport').find('img[data-original]').trigger('forceLazyLoad');