隐藏Safari地址栏和页脚 [英] Hide Safari address bar and footer

问题描述

在我的jQuery Mobile项目中，我正在使用以下代码:

On my jQuery Mobile project I'm using the following code:

<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">

我正在获取Safari浏览器的地址栏和导航页脚.如何隐藏这些内容，以便我可以显示我的应用程序?

I'm getting the Safari browser address bar and nav footer. How can I hide those so I can just have my app showing?

推荐答案

您可以设置一些元标记来告诉iOS，您的网站可以作为Web应用程序添加到主屏幕.从那里启动后，所有Safari元素都会被隐藏.

You can setup a few meta tags to tell iOS that your site can be added to the Home Screen as a web app. Once launched from there, all of the Safari elements are hidden.

查看标题为隐藏Safari用户界面组件"的部分这里.

Check out the section titled "Hiding Safari User Interface Components" here.

您可以指定应用程序在主屏幕上显示的启动初始屏幕图像和自定义图标.

You can specify start up splash screen images and custom icons for the app as it appears on the home screen.

<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<link rel="apple-touch-icon" href="apple-touch-icon-57x57.png" />
<link rel="apple-touch-icon" sizes="72x72" href="apple-touch-icon-72x72.png" />
<link rel="apple-touch-icon" sizes="114x114" href="apple-touch-icon-114x114.png" />
<link rel="apple-touch-startup-image" href="apple-touch-startup-image-320x460.png" />
<link rel="apple-touch-startup-image" sizes="768x1004" href="apple-touch-startup-image-768x1004.png" />

这篇关于隐藏Safari地址栏和页脚的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！