javascript - 浏览器很小时隐藏面板

Question

我有一个关于根据浏览器大小显示/隐藏内容的问题。

我正在编码的网站目前是本地的，所以我无法显示整个页面。然而，问题是:

主站点的宽度为 1000 像素。右侧有一个小面板，位于 1000 像素的外部，用于特殊内容。特殊内容是 200 像素宽，这意味着当浏览器小于 1400 像素宽时，我会在底部看到一个垂直滚动条。相反，我希望在浏览器达到 <1400px 时删除/隐藏该内容。我正在使用以下代码:

    @media all and (max-width: 1400px) {
      #side-items {
        display:none;
      }
    }

这适用于 Chrome/Safari/Firefox，但不适用于 IE(我必须支持 IE8+)。有没有办法跨浏览器为屏幕较小的用户隐藏该面板？我对 JS/JQuery 没有太多经验，所以我不确定是否有脚本可以满足我的需求。

谢谢!

Answer 1

IE8 不支持媒体查询。您必须使用 polyfill 才能获得所需的功能。

Here is one我过去用过。