ControlledChaos of Controlled Chaos Design
8/9/2016 - 6:58 PM

Apply Fancybox to image links and galleries and exclude mobile devices.

Apply Fancybox to image links and galleries and exclude mobile devices.

no-mobile-fancybox-links.js
content_copyfile_download
var pixelRatio = window.devicePixelRatio || 1;
// applies Fancybox only if device screen is wider than 768px
if(window.innerWidth/pixelRatio > 768 ) {
        jQuery("a[href$='.jpg'],a[href$='.jpeg'],a[href$='.png'],a[href$='.gif']").attr('rel', 'gallery').fancybox({
    });
}
README.md
content_copyfile_download
  • Rendered
  • Source

Fancybox Image Links Disabled on Mobile

Install Fancybox then add this Javascript before the closing <body> tag to apply Fancybox to image links and gallery links. Adjust the screen width to your needs (set here for 768px and less).