iPhone向下滚动问题时标题隐藏

Question

当您向下滚动时消失时，我正在做汉堡菜单。并在您向上滚动时显示。它可以与其他手机配合使用，但不适用于iPhone。问题是iPhone让您向上方滚动而不是“可能”，因此浏览器使您回到正常情况，那是有问题的地方。然后，iPhone中的浏览器稍微向下滚动网站，汉堡菜单消失。我希望你明白我的意思。

以下是该网站的链接：http://www.jsdkqwoj.eu/

隐藏JavaSript：

<header>
    <div class="">
        <div class="container header-korkeus">
            
                    <nav class="menusetti d-flex justify-content-center align-items-center column text-center">
                        <?php wp_nav_menu(); ?>
                    </nav>
        </div>
    </div>
    <div id="hampurilainen" class="topnav">
        
      
        <a class="icon" onclick="openNav()">
        <i class="hamburger_bars">
            <div class="bar1"></div>
            <div class="bar2"></div>
            <div class="bar3"></div>
        </i>
        </a>
    </div>

    <div id="myNav" class="overlay">
  <a href="javascript:void(0)" class="closebtn" onclick="closeNav()"><svg width="60px" height="60px" viewBox="0 0 16 16" class="bi bi-x" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
  <path fill-rule="evenodd" d="M11.854 4.146a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708-.708l7-7a.5.5 0 0 1 .708 0z"/>
  <path fill-rule="evenodd" d="M4.146 4.146a.5.5 0 0 0 0 .708l7 7a.5.5 0 0 0 .708-.708l-7-7a.5.5 0 0 0-.708 0z"/>
</svg></a>
  <div class="overlay-content">
    <a class="menulinkki" href="#catalogs" onclick="closeNav()">PALVELUT</a>
    <a class="menulinkki" href="#referenssit" onclick="closeNav()">REFERENSSIT</a>
    <a class="menulinkki" href="#contact" onclick="closeNav()">YHTEYSTIEDOT</a>
  </div>
</div>
    


<script>
function myFunction() {
  var x = document.getElementById("myLinks");
  if (x.style.display === "block") {
    x.style.display = "none";
  } else {
    x.style.display = "block";
  }
}
function myFunction2(x) {
  x.classList.toggle("change");
}

</script>
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<script>
  AOS.init();
</script>
<script>
function openNav() {
  document.getElementById("myNav").style.width = "100%";
}
function closeNav() {
  document.getElementById("myNav").style.width = "0%";
  $("#hampurilainen").fadeIn();
}
</script>
<script>
var prevScrollpos = window.pageYOffset;
window.onscroll = function() {
var currentScrollPos = window.pageYOffset;
  if (prevScrollpos > currentScrollPos) {
    document.getElementById("hampurilainen").style.top = "0";
  } else {
    document.getElementById("hampurilainen").style.top = "-55px";
  }
  prevScrollpos = currentScrollPos;
}
</script>


<script>
$(document).ready(function(){
  $(".topnav").click(function(){
    $("#hampurilainen").fadeOut();
  });
  $(".closebtn").click(function(){
    $("#hampurilainen").fadeIn();
  });
});
</script>

WordPress wp nav隐藏在移动版本中。不用担心，我只是尝试修复此菜单项。

这是CSS代码：

header {

        background-color: rgba(0, 0, 0, 0);

        height: 0px;

    }

    #hampurilainen {
        position: fixed;
        top: 0;
        right: 0;
        display: block;
  transition: top 0.3s;
}