为什么我的粘性导航JS在iPhone上不起作用?

时间:2019-09-13 19:39:59

标签: javascript html wordpress wordpress-theming sticky

我正在以Underscores为基础研究WordPress主题。我使用JavaScript来控制粘性导航,它在浏览器和浏览器中的移动模拟器中都很好用,但是在实际的iPhone上,导航栏只是固定在页面顶部。

网站网址为https://18theditionbooks.co.uk

这是我的JS:

var stickPoint = document.getElementById('site-navigation').offsetTop;

function stickyHeader(){
  var vw = window.innerWidth;
  var st = document.documentElement.scrollTop;
  if (vw<1086){
    if (st >= stickPoint) {
      document.getElementById('masthead').style.position = 'fixed';
      document.getElementById('masthead').style.top = (stickPoint*-1)+'px';
    } else {
      document.getElementById('masthead').style.position = 'absolute';
      document.getElementById('masthead').style.top = 0;
    }
  } else {
    document.getElementById('masthead').style.position = 'fixed';
  }
}

window.addEventListener('scroll',stickyHeader);
window.addEventListener('resize',stickyHeader);

我还尝试过添加/删除类而不是直接设置样式,但这会产生完全相同的结果。

有什么想法为什么在iOS上不起作用?

0 个答案:

没有答案