0

I'm using this lazy load plugin and it's works fine on desktop. But on mobile device, the image only load when clicked.

$("img.lazy").lazyload({effect : "fadeIn"});

How to make it work the same way as on the desktop?

marcelo2605
  • 2,349
  • 20
  • 46

1 Answers1

0

Found a solution here: https://stackoverflow.com/a/10364620/3691686

CSS

@media only screen and (max-width: 1024px) {
    #mobile-detect { display: none; }
}

Javascript

var is_mobile = false;

if( $('#mobile-detect').css('display')==='none') {
    is_mobile = true;       
}

if (is_mobile === true) {
    $('img.lazy').each(function(){
        $(this).attr('src',$(this).data('original'));
    });
}else{
    $("img.lazy").lazyload({effect: "fadeIn"});
}
Community
  • 1
  • 1
marcelo2605
  • 2,349
  • 20
  • 46