Browser Coverage and Exception Handling

SpinViewer

General case

SpinViewer browser compatibility is based on the support of a CSS property called backgroundSize.

The browser compatibility for the backgroundSize style property is as follows:

Internet Explorer	Edge	Chrome	Firefox	Safari	iOS	Android
9+	latest	latest	latest	latest	7+ default	2.3+ default

If there is a body tag in the page, you can easily determine whether SpinViewer is enabled with the following simple conditional expression (feature detection):

var canUseSpinViewer = "backgroundSize" in document.body.style;

It is recommended to use Modernizr to check for strict browser compatibility, which can be checked for actual operation whether or not the tag is body. Modernizr is a very popular library for feature detection.

var canUseSpinViewer = Modernizr.backgroundsize;

Exceptional case

An exception has been reported that can not be determined by the above conditions. #39

In the Galaxy S6 Edge (5.0.2), Default Browser (3.0), the backgroundSize calculation fails in the following situations:

• Image type is jpeg (png is no pixel size issue) AND Image size exceeds 3.7 megapixels (eg 392 x 9405)

For reference, Galaxy S6, Default Browser (3.0) works normally

Therefore, if you need to service the above situation, you can consider handling the exception according to agent as follows.

var ua = window.navigator.userAgent;
var isExceptionBrowser = ua.indexOf("SAMSUNG SM-G925S") >= 0 && ua.indexOf("Android 5.0.2") >= 0 && ua.indexOf("SamsungBrowser/3.0") >= 0;

canUseSpinViewer = canUseSpinViewer && !isExceptionBrowser;

Reference. Galaxy S6 Edge User Agent information for Android 5.0.2, Default Browser 3.0

Mozilla/5.0 (Linux;Android 5.0.2;SAMSUNG SM-G925S Build/LRX22G) AppleWebkit/537.36(KHTML, like Gecko) SamsungBrowser/3.0 Chrome/38.0.2125.102 Mobile Safari/537.36