fresco-disable-mobile.js

/*!
 * Disable Fresco on Mobile Browsers
 * http://www.frescojs.com
 */
(function($) {
  var SUPPORTS_TOUCH = (function() {
    try {
      return !!(('ontouchstart' in window) || 
        window.DocumentTouch && document instanceof DocumentTouch);
    } catch (e) { 
      return false;
    }
  })();

  // don't use this on non-touch devices
  if (!SUPPORTS_TOUCH) return;

  var viewport = (function() {
    // Mobile Safari
    if (!!navigator.userAgent.match(/Apple.*Mobile.*Safari/)) {
      return function() {
        return {
          width: window.innerWidth,
          height: window.innerHeight
        };
      };
    } else {
      // everything else
      return function() {
        return {
          width:  $(window).width(),
          height: $(window).height()
        };
      };
    }
  })();

  $(document).ready(function() {
    $(window).bind('resize orientationchange', function() {
      var vp = viewport(),
          disable = false;

      if ((vp.width <= 568 && vp.height <= 320) || 
          (vp.width <= 320 && vp.height <= 568)) {
        disable = true;
      }

      Fresco[disable ? 'disable' : 'enable']();
    })();
  });
})(jQuery);

any difference between using this and checking the user agent via php, curious if I should use this or something like wp_is_mobile() instead

This code only disables Fresco on small touch based devices like the iPhone. A lightboxed image would be about the same size as the original there, so you don't get much benefit. It'll still work on the iPad since it has a larger screen with room to create a decent enlargement.

Not sure what wp_is_mobile() does, perhaps it checks for the same thing. Just checking the user agent in php could do the same thing, but only javascript allows optimizing for screen size.

Doesn't appear to work with Fresco 2.3.0