编程语言
首页 > 编程语言> > javascript – 用于删除移动网络应用中地址栏的跨平台方法

javascript – 用于删除移动网络应用中地址栏的跨平台方法

作者:互联网

我正在开发一个移动网络应用程序,我正在尝试删除地址栏.除非< body>的自然高度不够高以允许滚动,否则它很容易.尝试我可能找不到可靠的iphone / android,跨设备方法确保< body>高到足以让地址栏消失.我见过的许多方法都依赖于screen.height,这使得页面比它需要的更加清晰.它应该非常高,足以让地址栏消失,不会更高!

有没有人有一个完美处理这个的脚本?我需要确定页面的高度减去iphone和android的地址栏.

我试过了:

screen.height //too tall
window.innerHeight //too short
document.documentElement.clientHeight //too short
document.body.clientHeight //almost but too short

允许JQUERY.

解决方法:

This site还有其他一些建议,但这个严肃,无忧无虑的建议在github:gist中提供并回答您的问题(为方便起见粘贴在这里):

function hideAddressBar()
{
  if(!window.location.hash)
  {
      if(document.height < window.outerHeight)
      {
          document.body.style.height = (window.outerHeight + 50) + 'px';
      }

      setTimeout( function(){ window.scrollTo(0, 1); }, 50 );
  }
}

window.addEventListener("load", function(){ if(!window.pageYOffset){ hideAddressBar(); } } );
window.addEventListener("orientationchange", hideAddressBar );

据我所知,添加到页面的额外高度(导致问题)和scrollTo()语句的组合使地址栏消失.

从同一站点,隐藏地址栏的“最简单”解决方案是使用scrollTo()方法:

window.addEventListener("load", function() { window.scrollTo(0, 1); });

这将隐藏地址栏,直到用户滚动.

This site将相同的方法放在超时函数中(没有解释理由,但它声称代码在没有它的情况下不能正常工作):

// When ready...
window.addEventListener("load",function() {
  // Set a timeout...
  setTimeout(function(){
    // Hide the address bar!
    window.scrollTo(0, 1);
  }, 0);
});

标签:android,javascript,jquery,mobile-safari,web-applications
来源: https://codeday.me/bug/20191004/1852900.html