在iPhone / Android上隐藏地址栏

时间:2013-08-03 16:37:48

标签: javascript jquery responsive-design

以下脚本隐藏了移动设备上的地址栏,但未隐藏显示/桌面上的地址栏。这是理想的结果,但我不明白为什么会这样。我猜想这也会隐藏所有设备上的地址栏。隐藏地址栏有更好的方法吗?有些人可以如此友好地指导我完成这件事吗?

我还读到我需要将下面的元标记添加到标题中,但我认为它没有效果。感谢您的投入!

<meta name="apple-mobile-web-app-capable" content="yes" 


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

var preventDefault = function(e) {
  e.preventDefault();
  return false;
};
</script>

1 个答案:

答案 0 :(得分:1)

你有两种不同的技术。

第一个说“这是一个单页面的网络应用程序”因此将在iOS设备上打开时没有地址栏 iff 从主屏幕图标启动(显然,这需要用户访问页面(地址栏可见)并将其添加到主屏幕。

第二个只是尝试向上滚动页面,以便地址栏滚出屏幕。移动设备执行此操作是因为它们具有小屏幕,因此它们让地址栏滚动到屏幕顶部。用户可以轻松向下滚动以将其恢复。

桌面浏览器通常不会显示在小屏幕上,所以他们没有理由在滚动时隐藏它。另一方面,允许用户了解他们当前访问的页面的地址是非常重要的反网络钓鱼措施。

因此:网站无法在现代浏览器中隐藏用户的地址栏。

相关问题