JSFiddle - React, Tailwind, and code Playground

by Mi_Creativity

JavaScript

var IEversion = detectIE();

if (IEversion !== false) {
  // if the returned value from detectIE function is not false -
  // then IE detected, do our stuff here
  if(IEversion < 9){
  	// if we have IE8 and below, we replace SVGs with PNGs
  	replaceSVG();
  }else if(IEversion < 16){
  	// Here, show svg but use javascript animation, as a fallback for
    // CSS animation, to do animation.
  }
} else {
  // it is not IE, Keep SVG
}

function detectIE() {
  var ua = window.navigator.userAgent;

  var msie = ua.indexOf('MSIE ');
  if (msie > 0) {
    // IE 10 or older => return version number
    return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);
  }

  var trident = ua.indexOf('Trident/');
  if (trident > 0) {
    // IE 11 => return version number
    var rv = ua.indexOf('rv:');
    return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);
  }

  var edge = ua.indexOf('Edge/');
  if (edge > 0) {
    // Edge (IE 12+) => return version number
    return parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);
  }

  // other browser
  return false;
}