iOS 8：修复div不工作的位置+不起作用的锚标签（codepen）

Question

简介

我有一个简单的网页：http://codepen.io/giancarloGiuffra/full/OVYERO（它使用bootstrap）

为了说明结构，html如下（简化）：

<nav id="nav-bar" class="navbar navbar-default navbar-fixed-top">
  <ul class="nav navbar-nav navbar-right">
      <li><a href="#home">Home</a></li>
      <li><a href="#portfolio">Portfolio</a></li>
      <li><a href="#about">About</a></li>
      <li><a href="#contact">Contact</a></li>
    </ul>
</nav>
<div id="content" class="container-fluid">
  <section id="home" class="row img-cover">
  </section>
  <section id="portfolio" class="row img-cover">
  </section>
  <section id="about" class="row img-cover">
  </section>
  <section id="contact" class="row img-cover">
  </section>
</div>

在css文件中，我设置了4个部分的背景图像，并使用javascript为每个部分分配视口的尺寸。我只使用css来做这个（vh单位）但它在iOS中不起作用，我被限制使用javascript来使其工作：

CSS

.img-cover {
  background-size: cover;
}
#home {
 background: url(urlToImage);
}
...

使用Javascript / jQuery的

//function declaration
  function changeVhWithPx() {
    var height = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
    var width = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
    $(".img-cover").css({
      height: height,
      width: width
    });
  };
  //apply function
  changeVhWithPx();
  $(window).resize(changeVhWithPx);

当用户滚动页面时，还有一些javascript / jquery可以更改不同部分的不透明度。

问题

它在桌面（chrome，firefox，safari，iexplorer最新版本）和Android中的功能，但它在iOS中运行良好。 iOS中的主要问题如下：

1. 导航栏不会停留在视口的顶部，向下滚动时会消失。
2. 锚标签不起作用，它们只是跳转到页面的不同部分，但在iOS中似乎只是重新加载页面。
3. 更改部分不透明度的回调函数不会绑定到滚动事件。

要解决问题1，我在我的css文件中明确指定了以下内容（即使我已经使用了bootstrap类 navbar-fixed-top ）：

#nav-bar {
  position: fixed !important;
  top: 0px !important;
}

虽然没用。然后我决定使用javascript，即使它应该是css领域：

$(window).scroll(function(){
  $("#nav-bar").offset({top: $(window).scrollTop(), left: 0});
});

但也没有运气。

对于第2和第3个问题，我真的没有找到解决方案，也无法在iOS中找到任何有关此类行为的内容。

感谢您的帮助。

更新1：

我发现由于某种原因（我必然会发现）滚动事件不会被触发。所以关于第3点，问题不在于约束，而是事件未被触发的事实。

更新2：

我已将同一网站部署到heroku。一切都有效，除了锚标签（所以点1和3都解决了）。我将与codepen中的人员核实，了解同一代码在另一个平台上的工作方式（更好）。

更新3

实际上锚标签在heroku中运行良好，我认为它们不起作用，因为悬停事件被转换为点击，所以我不得不双击以通过链接重定向。