Javascript 粘性导航条ios问题

一段时间以来，我一直在努力解决这个问题，但不幸的是，我似乎做错了什么。我知道在网络上和StackOverflow上都有一些关于这个的问题，但是按照这些提示我无法解决。正如你在标题上看到的，我面临着iOS浏览器（Safari和Chrome）的一个非常著名的bug。事实上，我用JS动态地检测滚动，并添加一个类，使元素固定，但它不能正常工作，因为位置：fixed；仅在滚动结束时生效。 这是我的代码：

CSS

JS（angularJS）

---

提前谢谢你，很抱歉再次问这个问题，但我就是不能解决它

你有一个实时url，这样我就可以在我的iPhone上看到它了吗？@NathanielFlick是的，你应该可以在上看到这个问题！

.sticky{
    z-index: 99;
    position: static;
}
.sticky-enabled{
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
   -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.15);
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

angular.element(document).on("scroll", function(){
   if(angular.element(this).scrollTop() > 50){
      angular.element($scope.element).addClass("sticky-enabled");
   }else{
      angular.element($scope.element).removeClass("sticky-enabled");
   }
});