如何隐藏 iPadOS 13 以来出现的 iPad Safari Web App 全屏模式上的新网址栏?

2023-12-04

现在,当通过 Safari 上的“添加到主屏幕”安装 WebApp 时,iPadOS 13 会显示白色/灰色条,即使添加了 apple-touch-fullscreen 元标记也是如此。该栏包含一个用于调整字体大小和请求桌面站点的菜单,但影响了可用的屏幕尺寸,因此用户现在必须滚动才能查看应用程序菜单。

有什么方法可以隐藏此栏,例如强制桌面/移动站点以便不需要选择?


我已经找到了解决这个问题的方法。

即使添加了 apple-touch-fullscreen 元标记,iPadOS 也会向 Web 应用程序添加 URL 栏,但现在使用与渐进式 Web 应用程序 (PWA) 一起使用的 manifest.json 文件来检测全屏模式。在 iOS 13 版本之前已经支持此功能,但直到现在才需要全屏体验。

在我的应用程序中,manifest.json 链接标记<link rel="manifest" href="manifest.json">仅在检测到 Google Chrome 时添加;更新它以在检测到 iPad 上的 Safari 时添加链接导致灰色条完全隐藏(请注意,iPad 检测在此版本中已更改,现在可以请求移动/桌面版本)

允许全屏的manifest.js文件如下所示(显示:“standalone”允许全屏)

{
    "name": "MyApp",
    "short_name": "MyApp",
    "description": "MyApp description",
    "version": "0.0.0.1",
    "manifest_version": 2,
    "default_locale": "en-GB",
    "author": "Christopher Dean",
    "start_url": "Home.aspx",
    "display": "standalone",
    "orientation": "landscape",
    "theme_color": "#015174",
    "background_color": "#F7F4F3",
    "icons": [
    {
      "src": "images/app-icon-chrome.png",
      "sizes": "128x128",
      "type": "image/png"
    },
    {
      "src": "images/app-icon-tiny.png",
      "sizes": "32x32",
      "type": "image/png"
    },
    {
      "src": "images/app-icon-192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "images/app-icon-512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
    ],
    "app": {
     "urls": [
       "http://MyApp/Home.aspx"
     ],
     "launch": {
       "web_url": "http://MyApp/"
     },
     "background": {
       "scripts": [ "chrome.js" ]
     },
     "permissions": [ 
      "unlimitedStorage",
      "notifications",
      "fullscreen"
     ]
    }
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何隐藏 iPadOS 13 以来出现的 iPad Safari Web App 全屏模式上的新网址栏? 的相关文章

  • Javascript:使用箭头键导航表格输入

    我正在为客户制作 HTML 成绩册 我使用 PHP 生成成绩册 然后输出一个 HTML 表 如下例所示 每个 td 包含一个带有 td
  • 带有占位符文本的文本框,该文本会逐字符消失

    我正在寻找一种方法来构造带有日期字段占位符文本的文本框 占位符文本将为 xx xx xxxx 并在用户键入时逐个字符消失 留下斜杠 我遇到了以下两个问题 它们似乎解决了使文本立即消失的问题 HTML CSS 制作一个文本框 其中的文本显示为
  • 如何使用 rel=preload 预加载材质图标?

    我正在尝试使用谷歌灯塔优化我的网页 该报告指出 在导入 Material Design 图标的链接上使用 rel preloads 我尝试使用语法预加载它们 我也尝试过使用字体进行预加载 类型为 woff woff2 和 ttf 它们似乎都
  • Doctype的实际使用

    虽然我在 w3 org 上浏览了大量有关 Doctype 的信息并了解不同类型的 doctype 过渡型 严格型 框架集 我还是不太清楚在页面上使用Doctype的实际用途是什么 I mean 是为了阻止开发商 在代码中使用某些标签 例如
  • Javascript document.getElementsByClassName 返回未定义

    我有一个函数应该相当简单 并且应该在加载后完成 以减少初始加载时间 基本上我使用这段代码来获取类 prefImg 的所有元素并用它们做一些事情 但是在firebug中调试时 它说var divsList未定义 function popula
  • JavaScript - 离焦事件?

    我想要做的是显示带有文本颜色的输入字段black 然后 当该人在输入字段内单击时 onfocus 我想将文本颜色更改为red 然后 当该人单击输入字段外部 不再焦点 时 我想将文本颜色更改回black 我知道如何处理 JavaScripto
  • 使用 RequireJS 的条件注释仅加载 IE7/8 jQuery

    我在我的项目中使用 Require JS 它加载 jQuery 和其他一些与整个网站和所有浏览器相关的 JavaScript 文件 但是 我需要在 Internet Explorer 7 和 8 上使用一些条件 jQuery 我尝试将其放在
  • 在 Bootstrap 导航栏后添加一些空间的最佳方法是什么?

    以下代码始终在页面顶部显示导航栏 我需要将第二个容器 内容 放置在导航栏的末尾而不是其下方 目前第二个容器位于导航栏下方 我可以在内容顶部添加一些空白 但我不确定这是一个好方法 知道如何解决吗 div class container div
  • PHP文件上传错误tmp_name为空

    我的文件上传遇到这个问题 我尝试在检查验证时上传 PDF 文件TMP NAME是空的 当我检查时 FILES document attach error 该值为 1 意味着存在错误 但当我尝试上传其他 PDF 文件时 它已成功上传 为什么其
  • CSS 轮廓宽度不起作用

    我正在尝试将输入元素的轮廓宽度设置为焦点 无论我的设置如何 轮廓宽度都保持不变 就像它是无法更改的默认设置一样 这是来自 codepen 的示例 http codepen io FrenkyB pen mEaEyL editors 1100
  • 如何仅提取 mysql 和 php 中具有非零值的列?

    我正在尝试从 mysql 数据库中提取并显示在网页上 仅非零列 哪一列的日期是 0000 00 00 我不想在网页上显示这些列 下面分别是HTML代码和php脚本
  • 如何使用 jQuery 将 html5 视频播放器静音

    我找到了如何使用 jquery 暂停和播放视频 video get 0 play video get 0 pause 但我找不到静音按钮 如果没有 jquery 解决方案 我只需一个 onclick js 解决方案即可 我需要尽快 还有有办
  • 有没有办法在 .ogg 视频完全加载之前知道其文件大小?

    我知道 ogg 视频和 mp4 视频之间的一个区别是 ogg 视频没有描述文件大小的元数据 因此当加载 ogg 视频时 控件无法显示文件完全加载之前的剩余时间 如果 ogg 视频长度超过几分钟 这可能会成为问题 有没有办法在请求页面时获取此
  • 如何在 Android 上禁用 HTML 输入中的自动更正?

    我无法在 Android 上的网络浏览器中禁用文本输入的自动更正 我试过这个
  • JQuery:检查元素是否处于正常流程中

    使用 jQuery 检查元素是否在正常流程中的最优雅的方法是什么 根据CSS3规范 http www w3 org TR css3 box 如果满足以下条件 则框属于流 其 display 的使用值为 block list item tab
  • 为什么虽然输入的值确实发生了变化,但jquery更改事件没有触发? [复制]

    这个问题在这里已经有答案了 JSFIDDLE http jsfiddle net meXm3 2 网页代码
  • Angular Material 中的 img 标签内的 md-tooltip

    我想在悬停在 3 个不同图像上时显示 3 个不同的工具提示
  • svg 圆不是用 javascript 绘制的

    我一直在尝试使用 HTML 中的 javascript 来进行 svg 操作的 hello world 我编写了下面的代码 虽然它生成了正确的 html 但我在浏览器中没有看到任何输出 也没有看到任何错误
  • regex php - 查找 div 中具有特定 ID 的内容

    我确信这是一个简单的问题 尽管我在谷歌上进行了如此多的搜索和搜索 但我似乎无法弄清楚这有什么问题 我在此页面上的其他区域使用类似的表达式来准确返回我想要的内容 但是 我无法让这个特定的位返回我想要的东西 所以也许有人可以帮助我 我有一个带有
  • 如何创建包含左对齐元素的宽度不确定的居中 div?

    我有几个统一的蓝色元素 div style display inline block 位于紫色 div 内的红色 div 内 Mockup https i stack imgur com ylTm9 png 图 我希望蓝色元素左对齐 一行中

随机推荐

  • 从 PHP 执行 Ruby 脚本并获取输出

    我有这个 Ruby 脚本 test rb print hello 我有这个 PHP 脚本 test php cmd ruby test rb system cmd 现在我通过 CLI 调用 PHP 脚本 php test php 我没有得到
  • 替换标识结束字符的多行

    我有下面的代码 CREATE TABLE Table1 column1 double NOT NULL column2 varchar 60 NULL column3 varchar 60 NULL column4 double NOT N
  • Apache Commons 电子邮件使用 base64 进行编码附加

    我正在尝试通过以下方式发送 base64 编码的文件apache commons mail我似乎无法理解Content Transfer Encoding base64标头应该去的地方 Create the email MultiPartE
  • 使用另一个文件夹中的 git“log”

    我在目录中A 我该如何执行git log对于目录中的 git 存储库B From man git 您可以使用 git dir参数 在传递任何命令之前 git git dir foo bar git log 指定 git目录是必要的 从文档
  • 如何在不同时间向 facebook 请求不同的权限?

    Facebook 建议 在使用 Facebook 登录时 您应该首先向用户请求尽可能少的权限 特别是避免请求发布权限 直到用户需要通过您的网站发布某些内容 https developers facebook com docs faceboo
  • 用于在窗口上打印串行数据的Python代码。

    我对 python 和 pyserial 很陌生 我的电脑安装了带有 pyserial 的 python 2 7 4 我想在我的电脑上的单独窗口上打印串行接收的数据 首先必须打开窗口 然后在该窗口上打印串行数据 这里必须打开一次窗口 并且必
  • 什么会让 git 在 git pull --rebase 期间删除本地文件?

    我正在尝试重现我尝试回答所导致的问题这个问题 In short github 用户尝试这样做git pull rebase并且该用户的本地文件已被删除 我尝试在 github 上重新创建这个场景 但在我的例子中没有删除任何内容 那么如何重现
  • C: printf 一个浮点值

    我想打印一个浮点值 该值在逗号后有 2 个整数和 6 个小数位 如果我只是使用printf f myFloat 我得到了一个被截断的值 我不知道这是否总是发生在 C 语言中 或者只是因为我使用 C 语言作为微控制器 确切地说是 CCS 但在
  • 如何在 Android 中调出锁屏?

    我想在单击按钮时调出设备的锁定屏幕 我搜索了很多并且知道可以通过DevicePolicyManager但不知道该怎么做 我还找到了很多例子 但它们都没有打开锁屏 没有错误 例如this or this 如何使用锁定设备DevicePolic
  • 如何在Python中计算One Class SVM的AUC?

    我在 python 中绘制 OneClassSVM 的 AUC 图时遇到困难 我使用 sklearn 生成混淆矩阵 例如 tp fp fn tn with fn tn 0 from sklearn metrics import roc cu
  • Grunt imagemin正在运行但不缩小

    Image min 运行正常 但我得到 0 个缩小的图像 为什么 在我的终端上运行代码后 grunt imagemin Running imagemin dist imagemin task Minified 0 images saved
  • 如何在 Laravel 5.0 中使用外全连接?

    这是我的控制器 public function lihatpesanansemua ajax if Request ajax hasil DB table pesanan gt join pemesan pemesan id pesanan
  • 解析字段名不一致的JSON字符串

    我在反序列化以下 JSON 结构时遇到问题 每个节点包含一个 ID 和带有值的多语言代码 语言属性的数量并不一致 但我需要这些值作为具有语言字段和值字段的对象列表 id w 312457 eng deep fat frying ger Fr
  • 需要帮助在单个单元格中获取多个值,并在 Excel 中满足条件

    我需要帮助来获取单个单元格中的值并满足条件 我想要单个单元格中的值低于 95 的违约者 e g 如果有动态数组公式 FILTER 和 TEXTJOIN TEXTJOIN CHAR 10 TRUE FILTER A2 A7 E2 E7 lt
  • 如何在 iOS 应用程序中以编程方式创建 PDF 文件?

    如何根据用户操作生成 PDF 文件 See 用石英画画 了解如何创建 PDF 图形上下文 一些注意事项 iPhoneOS注意 如果您想在 iPhone 应用程序中创建 PDF 图形上下文 请确保您还阅读了 在 iPhone OS 中绘制到图
  • 在 C# 中使用 AES 加密

    Locked 这个问题及其答案是locked因为这个问题是题外话 但却具有历史意义 目前不接受新的答案或互动 我似乎找不到使用 AES 128 位加密的清晰示例 有人有一些示例代码吗 如果您只想使用内置加密提供程序 RijndaelMana
  • 注销 WordPress 并重定向到不同的 URL

    我的网站上有一个用于注销 Wordpress 的注销选项 注销后 我想将用户重定向到不同的 URL 我在functions php中使用它 add action wp logout auto redirect external after
  • 使用 PySide 和 QTextEdit 半透明突出显示

    我创建了一个 QTextEdit 对象 下面的代码向当前选定的文本添加随机颜色的突出显示 我需要高光是半透明的 这样我就可以看到高光彼此分层 使用 setAlpha 似乎没有做任何事情 如何设置突出显示的 Alpha 或以其他方式获得半透明
  • 在 Active Directory 中查找用户的管理员记录

    我尝试使用 Active Directory 查找用户经理的 SamAccountName 和电子邮件 我通过搜索在 AD 中找到登录用户 其中 sAMAccountName Domain Account 然后 我检索管理器属性 如下所示
  • 如何隐藏 iPadOS 13 以来出现的 iPad Safari Web App 全屏模式上的新网址栏?

    现在 当通过 Safari 上的 添加到主屏幕 安装 WebApp 时 iPadOS 13 会显示白色 灰色条 即使添加了 apple touch fullscreen 元标记也是如此 该栏包含一个用于调整字体大小和请求桌面站点的菜单 但影