iOS 13 [添加到主屏幕] 和 [隱藏工具欄]
[英]iOS 13 [Add to Home Screen] and [Hide Toolbars]
問題描述
在之前的 iOS（12 及之前）或任何 Android 手機中，我們可以使用 Safari（或 Android 中的任何瀏覽器）中的 [添加到主屏幕]（或 Android 中的任何瀏覽器）使用以下技術隱藏工具欄：
- 在索引中。html：
<head>
<meta name="viewport" content="viewport-fit=cover, width=device-width,initial-scale=1.0, maximum-scale=1.0, shrink-to-fit=no">
<link rel="apple-touch-icon" href="/customicon.png"/>
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="application-name" content="BGBG01">
<meta name="apple-mobile-web-app-title" content="BGBG01">
<meta name="msapplication-starturl" content="/">
<link rel="manifest" href="manifest.json">
</head>
- 在根目錄下創建文件manifest.json，內容如下：
{
"name": "App Full Name",
"short_name": "AppName",
"lang": "zh-CN",
"start_url": "/",
"scope": "/",
"display": "standalone"
}
但是，由於iOS 13，上述方法不再起作用，工具欄仍然存在，我們需要單擊地址欄左側的aA，然后每次選擇[隱藏工具欄]，以隱藏工具欄的 PWA。
那么我們如何隱藏工具欄呢？
編輯
只是想強調一下，下面的js代碼也不好用：
<script>
if (navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i)) {
/* iOS hides Safari address bar */
window.addEventListener("load",function() {
setTimeout(function() {
window.scrollTo(0, 1);
}, 1000);
});
}
</script>
或者
<body>
<button id="goFS">Go fullscreen</button>
<script>
var goFS = document.getElementById("goFS");
goFS.addEventListener("click", function() {
document.body.requestFullscreen();
}, false);
</script>
</body>
此鏈接提供的解決方案也不起作用：
1 個解決方案
解決方案1
-1 2021-07-09 08:54:24
對於您的情況，這種方法可以智能高效嗎？ 使用這個最小的 webmanifest 菜單欄也會消失嗎？
{
"name": "My Super App",
"short_name": "My App",
"display": "standalone",
"scope": "/my-app-path/",
"start_url": "/my-app-path/"
}
“添加到主屏幕”圖標在 iOS 13 和 HTTPS 上不起作用
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.