Javascript iPhone上的固定标题背景问题'；s狩猎

我在iPhone的Safari上的修复头有问题。当窗口向下滚动时，header会得到“fixed_header”类，该类还会向其添加白色背景（原始背景颜色是透明的），并将其中的其他元素更改为较暗的颜色

它在Chrome上工作得很好，但在Safari中，当我向上滚动时，.up类保持其白色背景，而其中的所有元素都恢复到其原始状态。我认为这可能与safari在滚动时更改地址栏高度有关，这可能会延迟或混淆js

我怎样才能修好它

 $(window).on("load resize", function(){
            var headerTop = $(".header").offset().top;
            var headerHeight = $(".header").outerHeight();
            $(window).on("scroll", function(){
                var scrollTop = $(window).scrollTop();
                if(scrollTop > headerTop){
                    $('.header').addClass("fixed_header");
                } else {
                    $('.header').removeClass("fixed_header");
                }
            });
        });

以下是css：

.fixed_header {
      background-color: white;
      position: fixed;
      top: 0;
      z-index: 999;
      @include SP {
        background-color: transparent;
        .up {
          background-color: white;
        }
        h1 {
          opacity: 0;
          position: absolute;
        }
        .logo {
          background-image: url("../images/common/logo_sp_sm_dark.png");
        }
        .contact_btn {
          background-image: url("../images/common/btn_contact_dark.png");
        }
        .menu-trigger span {
          background-color: #1e2328;
        }
      }
    }

---

我解决了我的问题，增加了背景更改的延迟，这将弥补Safari地址栏大小调整所造成的差距

var moven = true;
    $(window).on("scroll", function() {
        if($(window).scrollTop() > 20 && moven == true) {
             $("header").addClass("fixed_header");
        } else {
             $("header").removeClass("fixed_header");
        }
    });