Skrollr 摧毁身体 100% 消除高度答案

【问题标题】：Skrollr destroy canceling out height 100% on bodySkrollr 摧毁身体 100% 消除高度
【发布时间】：2014-07-29 09:59:43
【问题描述】：

好的，所以我正在使用 bootstrap 3 和 skrollr.js，我的页面顶部有一个全屏英雄单元，它有一个简单的 skrollr 视差效果。我也有一些 js 以 768 宽度“激活”和“摧毁”skrollr。这很好用，但是当我缩小浏览器窗口的大小时，height:100% 只是由于某种原因没有应用于正文。

我相信问题出在我的 js for skrollr 的某个地方，即：

$(function () {

  // initialize skrollr if the window width is large enough
  if ($(window).width() > 768) {
    skrollr.init({forceHeight: false,smoothScrolling: true, smoothScrollingDuration: 1500});
  }

  // disable skrollr if the window is resized below 768px wide
  $(window).on('resize', function () {
    if ($(window).width() <= 768) {
      skrollr.init().destroy(); // skrollr.init() returns the singleton created above
    }
  });

});

我已经尝试以各种方式调整 js，但仍然没有找到解决方案，我目前正在寻找在触摸设备上禁用 skrollr 的不同方法。

You can view the js fiddle here.

如果您将窗口缩小到移动设备大小，您会看到英雄单位变小而不是全屏。但是如果你刷新它就可以了，有人有什么想法吗？

【问题讨论】：

所以我通过将!important 添加到height: 100%; 来解决此问题，但现在当我调整浏览器大小时 skrollr 无法打开。

标签： javascript twitter-bootstrap height skrollr

【解决方案1】：

我通过在 body 和 html 标记上将 !important 添加到 height:100%; 来解决此问题。

还将我的 start-skrollr.js 更改为：

$(function () {
  if ($(window).width() > 767) {
    skrollr.init({forceHeight: false,smoothScrolling: true, smoothScrollingDuration: 1500});
  }
});

不需要我的 .js 文件的最后一部分。

【讨论】：