Question

我正在使用Foundation 5和Slick轮播（不再支持轨道）。 Mobile Header有一个占位符，应该显示在移动设备上（显示为小），但应该在桌面，笔记本电脑等上显示Slick轮播（隐藏为小）。这适用于除ie9之外的所有浏览器。

在IE9上，占位符一直显示，并且Slick Carousel甚至没有显示。这是我的代码......

<!-- begin Slick Carousel - 12 column -->

  <div><img src="img/social-work.jpg" alt="The Master of Social Work program has grown by over 130% since its inception in Fall 2011" title="The Master of Social Work program has grown by over 130% since its inception in Fall 2011" /></div>
</div>

      <img src="http://placehold.it/1200x700&text=Mobile Header">

    </div>
  </div>

以下是网址：http://cassian.memphis.edu/profiles/fall2014/index.html

任何帮助将不胜感激！

Answer 1

由于MatchMedia向后兼容性错误，我无法使用Slick Carousel。

我收到此错误：SCRIPT5022: matchMedia not present, legacy browsers require a polyfill

为了解决这个问题，我使用了matchmedia polyfill。

选项1 安装匹配媒体polyfill npm软件包，然后只需在应用顶部使用它：

npm install match-media

var MatchMedia = require('match-media');

选项2 （如果您没有构建步骤）：在光滑轮播脚本之前，在页面上包含此polyfill脚本：

<script src="https://cdnjs.cloudflare.com/ajax/libs/webshim/1.15.10/dev/shims/matchMedia.js"></script>

光滑的旋转木马不在ie9工作

1 个答案: