当页面100%缩放时，CSS Media Query无法工作

// 检测页面缩放比例
function detectZoom() {
  var ratio = 0,
    screen = window.screen,
    ua = navigator.userAgent.toLowerCase();

  if (window.devicePixelRatio !== undefined) {
    ratio = window.devicePixelRatio;
  } else if (~ua.indexOf('msie')) {
    if (screen.deviceXDPI && screen.logicalXDPI) {
      ratio = screen.deviceXDPI / screen.logicalXDPI;
    }
  } else if (window.outerWidth !== undefined && window.innerWidth !== undefined) {
    ratio = window.outerWidth / window.innerWidth;
  }

  if (ratio) {
    ratio = Math.round(ratio * 100);
  }

  return ratio;
}

// 添加或移除CSS类
function handleZoom() {
  var zoomLevel = detectZoom();
  var body = document.getElementsByTagName('body')[0];

  if (zoomLevel === 100) {
    body.classList.add('zoom-100');
  } else {
    body.classList.remove('zoom-100');
  }
}

// 监听窗口大小变化事件
window.addEventListener('resize', handleZoom);

// 页面加载完成时执行一次
window.addEventListener('load', handleZoom);