Question

好吧我正在使用bootstrap 3和skrollr.js，我的页面顶部有一个全屏英雄单元，它有一个简单的skrollr视差效果。我也有一些js＆＃34;激活＆＃34;和＃34;摧毁＆＃34; skrollr在768宽度。这样可以正常工作，但是当我向下调整浏览器窗口大小时，由于某种原因，height:100%只是不适用于正文。

我相信这个问题在我的js中对于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.

如果您将窗口缩小到移动尺寸，您会看到英雄单位变小而不是全屏。但如果你刷新它工作正常，任何人都有任何想法？

Answer 1

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

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

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

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

Skrollr在身体上消除100％的身高

1 个答案: