首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

升级到iOS 11.3后,web应用程序不会根据支持的apple-mobile-web应用程序显示全屏

升级到iOS 11.3后,web应用程序不会根据支持的apple-mobile-web-app显示全屏。

这是因为在iOS 11.3中,苹果对Web App的全屏显示做出了一些改变。在之前的版本中,可以通过在Web App的HTML头部添加meta标签来实现全屏显示,例如:

代码语言:txt
复制
<meta name="apple-mobile-web-app-capable" content="yes">

然而,在iOS 11.3中,苹果对这个meta标签的行为进行了修改。现在,即使添加了这个meta标签,Web App也不会自动全屏显示。

这个改变可能是为了提供更好的用户体验和安全性。用户可以更方便地退出Web App,而不需要通过多次滑动来关闭应用。此外,这也可以防止一些恶意网站将用户锁定在全屏模式下。

如果您希望在iOS 11.3及更高版本中实现Web App的全屏显示,可以考虑使用以下方法:

  1. 添加一个按钮或链接,让用户主动选择将Web App添加到主屏幕,并在主屏幕上以全屏模式打开。您可以使用以下代码来检测用户是否使用iOS设备,并提示用户进行添加操作:
代码语言:txt
复制
if (navigator.standalone) {
  // Web App is running in standalone mode
} else {
  // Web App is not running in standalone mode
  // Show a button or link to prompt the user to add the app to the home screen
}
  1. 使用JavaScript的全屏API来实现全屏显示。您可以使用以下代码来请求全屏显示:
代码语言:txt
复制
var element = document.documentElement;
if (element.requestFullscreen) {
  element.requestFullscreen();
} else if (element.mozRequestFullScreen) {
  element.mozRequestFullScreen();
} else if (element.webkitRequestFullscreen) {
  element.webkitRequestFullscreen();
} else if (element.msRequestFullscreen) {
  element.msRequestFullscreen();
}

请注意,这种方法需要用户主动触发全屏请求,不能在页面加载时自动全屏。

总结起来,升级到iOS 11.3后,Web App不会根据支持的apple-mobile-web-app显示全屏。如果您希望在iOS 11.3及更高版本中实现全屏显示,可以考虑使用上述方法来实现。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

PWA渐进式增强WEB应用

可靠——即时加载,即使在不确定网络条件下也不会受到影响。 当用户从主屏幕启动时,service work可以立即加载渐进式Web应用程序,完全不受网络环境影响。...他们提供了一个沉浸式全屏幕体验,甚至可以重新与用户接触Web推送通知。 ? 还有其他一些优势 1. 无需安装,无需下载,只要你输入网址访问一次,然后将其添加到设备桌面就可以持续使用。 2....PWA现在还没那么火,国内一些手机生产上在Android系统上做了手脚,似乎屏蔽了PWA, 但是相信当PWA火起来以后,这个问题就不会是问题 Web应用程序中,可以通过manifest.json控制应用程序显示方式和启动方式...根据官方介绍,不难看出,pwa目标直指原生app,那接下来我们就来了解下PWA到底是个怎么样何方神圣。...PWA发展趋势 2016年, PWA在google正式落地,基于 Chromium 浏览器 Chrome 和 Opera 已经完全支持 PWA 了 随着 iOS 11.3 发布,iOS正式开始支持

1.2K20

【最新】iPhone X 交互设计官方指南

如果你应用程序具有自定义布局,那么支持 iPhone X 也应该比较容易。如果你应用程序使用 Auto Layout 并且遵守安全区域和边距布局指南的话。...所有的应用程序都应遵循 UIKit 中定义安全区域和布局边距,这些区域可以根据设备和上下文进行适当填充。安全区域还能够防止内容把状态栏、导航栏、工具栏和标签栏覆盖掉。 注意状态栏高度。...iPhone X 上状态栏比其他 iPhone 上更高。如果你应用程序状态栏高度比默认状态栏高,那么你必须更新自己应用程序,这样才能动态根据用户设备定位内容。...同样道理,iPhone X 上图稿在全屏显示时会被裁剪或者添加黑边。 如果要继续使用在 4.7 英寸 iPhone 上全屏显示图稿,一定要注意在两种显示尺寸上兼容性问题。...#ios-apps ---- 往期精选文章 ES6中一些超级好用内置方法 浅谈web自适应 使用Three.js制作酷炫无比无穷隧道特效 一个治愈JavaScript疲劳学习计划 全栈工程师技能大全

1.9K20

【业界】iOS Bug解决办法:如何防止Siri读出隐藏通知

要禁用应用程序通知,你需要进入设置,然后选择通知。选择你不想显示通知应用程序,并在“锁定屏幕上显示”切换。对其他应用程序也做同样操作——你不想在锁屏上发送通知。...iOS错误另一个解决方法是,当你iPhone被锁定时,你需要完全禁用Siri。此选项可以通过前往设置应用程序,然后点击Siri和搜索菜单来完成。在那里有一个切换为“允许Siri锁定时”选项。”...到目前为止,在ios11.3的当前测试版本中没有发现这种修复程序。下一个预发布版本可能会附带锁屏错误解决方案。...如果是这样的话,那么果粉们可能会更加期待iOS 11.3成为可以结束Siri问题更新版本。 苹果总是很快提出修复方案,以解决高度宣传Bug或者获得媒体关注Bug。...因此,如果iOS 11.3将是针对有争议错误修复而推出,那将不会是一个惊喜。除了修复之外,许多用户也期待iOS 11.3,因为它会附带健康记录、新animoji和深度电池监控程序等新功能。

1.1K40

Flutter 2.5正式版发布,带来重大更新

此版本延续了一些重要性能和工具改进,同时又发布了一些新功能,包括: 对 Android 全屏支持、更多 Material You(也称为 v3)支持; 更新文本编辑以支持可切换键盘快捷键; 在...例如,下面显示了 ListView 根据列表大小显示滚动条。...同时,在 Web 上查看相机预览、拍照、使用闪光灯和缩放控件提供基本支持,不过目前还不是被认可插件,因此开发者需要明确添加它以在才能在 Web 中使用。...更容易界面分析和定位:Flutter 框架中常用 Widget 都会在左侧 Widget 树视图中显示图标,它们根据类别进一步进行颜色编码,例如布局 Widget 显示为蓝色,而内容Widget...放弃对市场份额不到 1% iOS 8 支持,使 Flutter 团队能够专注于更广泛使用新平台,弃用意味着这些平台可以工作,但我们不会在这些平台上进行功能更新和插件支持

4.3K50

HBO Max for Mac(HBO Max视频客户端)

适用于 macOS 最佳独立 HBO Max 应用程序。不再在浏览器选项卡之间切换。只需直接从 Dock 启动 Clicker for HBO Max 即可开始狂欢。...测试系统: Big sur 11.3 Clicker for HBO Max mac版安装教程 软件下载完成,双击。...带视频控制画中画 多任务处理? 借助内置画中画支持,您可以在浏览TPS报告时观看自己喜欢视频。 只是不要让老板抓住你! 另外,与其他PiP窗口不同,从PiP窗口控制视频播放。...真正全屏视频播放 与 HBO iPad 应用程序不同 停止尝试在您 M1 Mac 上使用 HBO 愚蠢 iPad 应用程序,并使用 Clicker for HBO Max 享受真正全屏播放荣耀...使用配置文件自动跳过,选择您配置文件一次,然后应用程序将每次自动选择该配置文件,直到您更改为不同配置文件。就像魔术一样! 根据喜好定制

1.7K20

2021年,薪酬最高5种编程语言

如果你想帮助 iPhone 用户充分利用他们智能手机,并在帮助他们同时获得不错收入,那么你就应该学习 Swift。 它受欢迎程度可能不会再上升,但也不会下降。...Swift 很容易学习,你可以用它做个应用程序,并放到 iOS 设备上。 现在,如果你当一名自由 Swift 开发者,或者找一份全职工作,每年可以赚到 11.5 万美元。...虽然 Python 有非常有用框架和库来支持最先进数据科学应用程序,但 Python 现如今流行真正原因是它在人工智能(AI)中表现。...它还让你可以相对轻松、快速地构建复杂应用程序。使用像 Django&Flask 这样框架,可以无缝转换到 Web 开发。...它定义了你,定义了你周围一切,定义了你长大发现自己在做什么。 同样,你今天选择编程语言将决定你未来职业道路。

82510

最新iOS设计规范七|10大视觉规范(Visual Design)

根据屏幕尺寸,不同尺寸类别组合适用于不同设备上全屏体验。 ? ? 2. 多任务尺寸类型。在iPad上,当应用程序在多任务配置运行时,尺寸类型也适用。 ? ?...如果当有人以不受支持方向握住设备时您应用程序不会自动旋转,那么他们会本能地知道如何旋转设备。 根据上下文自定义APP对旋转响应。...请注意,当诸如录音和位置跟踪之类后台任务处于活动状态时,全屏iPhone上状态栏不会更改高度。 如果你APP当前隐藏状态栏,请重新考虑全屏iPhone隐藏与否。...你还应该允许用户根据个人喜好在全屏和适应屏幕模式之间自由切换。 始终以原生纵横比显示视频内容。...当视频内容使用嵌入式信箱或邮筒模式填充以符合特定纵横比时,iOS无法根据用户选择观看模式正确地缩放视频。嵌入视频会使其在全屏模式和适合屏幕模式下显示得更小。

7.9K30

IOS原生浏览器使用智能应用横幅宣传应用,创建横幅以从网站在App Store上推广您应用。

他们喜欢在网页顶部贴上醒目的横幅,而不是全屏显示,以免打断他们对Web内容体验。借助醒目的大型“关闭”按钮,横幅很容易消除。当用户返回网页时,横幅不会重新出现。...当他们返回您网站时,进度条将出现在横幅中,指示完成下载将花费多长时间。应用程序下载完成,“查看”按钮将变为“打开”按钮,点击横幅将打开该应用程序,同时保留您网站中用户内容。...如果您包含URL,并且用户安装了您应用程序,则他们可以从您网站跳转到iOS应用程序相应位置。...如果用户正在创建内容,则可以传递会话ID来将Web会话状态下载到您应用程序,以便用户可以无损地恢复其工作。您可以app-argument使用服务器端脚本为每个页面动态生成参数。...您可以根据自己喜好设置格式,只要它是有效URL即可。

1.4K10

谷歌 Flutter 1.17 发布

移动性能和尺寸改进 此版本主要重点是性能和内存改进方面的总体工作。只需将您应用程序升级到此版本,您用户就会看到更快动画,更小应用程序和更低内存利用率。...测试PR随时间合并应用程序内存使用情况(条形越短越好) 但是,最广泛性能改进是iOS中对Metal支持。...Metal支持可将iOS性能提高50% 苹果公司在iOS上对Metal支持几乎可以直接访问底层GPU,并且是苹果公司推荐图形API。...更新文本选择在Android上溢出 iOS更新文本选择溢出 当按钮长度比没有溢出时可以显示时间长时,文本选择菜单现在可以提高Android和iOS保真度。...,“网络”选项卡将显示Flutter应用程序网络流量。

3.5K10

Flutter 2.5正式版发布,带来多项重大更新

此版本延续了一些重要性能和工具改进,同时又发布了一些新功能,包括: 对 Android 全屏支持、更多 Material You(也称为 v3)支持; 更新文本编辑以支持可切换键盘快捷键; 在...例如,下面显示了 ListView 根据列表大小显示滚动条。...同时,在 Web 上查看相机预览、拍照、使用闪光灯和缩放控件提供基本支持,不过目前还不是被认可插件,因此开发者需要明确添加它以在才能在 Web 中使用。...更容易界面分析和定位:Flutter 框架中常用 Widget 都会在左侧 Widget 树视图中显示图标,它们根据类别进一步进行颜色编码,例如布局 Widget 显示为蓝色,而内容Widget...放弃对市场份额不到 1% iOS 8 支持,使 Flutter 团队能够专注于更广泛使用新平台,弃用意味着这些平台可以工作,但我们不会在这些平台上进行功能更新和插件支持

3.5K00

薪酬最高编程语言居然是?

当与中小企业或初创企业合作时,他们会要求开发人员在更短时间内更快地创建 Web 和移动应用程序。 好了,让我们进入今天最主要内容。...如果你想帮助 iPhone 用户充分利用他们智能手机,并在帮助他们同时获得不错收入,那么你就应该学习 Swift。 它受欢迎程度可能不会再上升,但也不会下降。...Swift 很容易学习,你可以用它做个应用程序,并放到 iOS 设备上。 现在,如果你当一名自由 Swift 开发者,或者找一份全职工作,每年可以赚到 11.5 万美元。...虽然 Python 有非常有用框架和库来支持最先进数据科学应用程序,但 Python 现如今流行真正原因是它在人工智能(AI)中表现。...它还让你可以相对轻松、快速地构建复杂应用程序。使用像 Django&Flask 这样框架,可以无缝转换到 Web 开发。

89640

Flutter 1.17版本重磅发布

只需将您应用程序升级到此版本,就会看到更快动画,更小应用程序和更低内存利用率。在此版本中,默认导航情况(不透明不透明路线)速度将提高20%-37%。...Metal支持iOS性能提高50% 苹果公司在iOS上对Metal支持几乎可以直接访问底层GPU,并且是苹果公司推荐图形API。...在完全支持MetaliOS设备上,Flutter默认情况下使用它,从而使您Flutter应用程序大多数时候运行得更快,平均使渲染速度提高约50%(取决于您工作量)。...现在,当按钮长度比没有溢出时可以显示时间长时,文本选择菜单可提高Android和iOS保真度。这在菜单项单词可能更长语言环境中尤其明显。...”按钮,“网络”选项卡将显示Flutter应用程序网络流量。

2.5K10

JavaFX 11发行说明

删除了功能和选项 删除对libavcodec 53和55支持 FX Media对libavcodec 53和55支持已被删除。默认情况下,这些库不在受支持Linux平台上,并且不再需要。...-8193311 [Spin​​ner]在ENTER上未激活默认按钮 控制 JDK-8193495 快速删除和添加操作,TabPane不会正确更新标题区域中选项卡位置 控制 JDK-8194913...FX API文档中错误 其他 JDK-8204956 修复JDK-8200285清理空白 其他 JDK-8207794 FXCanvas被重新定义时,FXCanvas不会更新EmbeddedStageInterface...中未显示透明色Alphachannel web JDK-8088925 非透明背景导致NumberFormatException web JDK-8089375 当WebWorker文件无法访问时,脚本应该以静默方式失败或发布有意义异常...调用 窗口工具包 JDK-8191885 [MacOS] JavaFX主窗口无法在MacOS中从全屏模式返回 窗口工具包 JDK-8196031 FX Robot mouseMove在Windows

6.5K60

HBO Max视频客户端适用于 macOS 最佳独立 HBO Max 应用程序

适用于 macOS 最佳独立 HBO Max 应用程序。不再在浏览器选项卡之间切换。只需直接从 Dock 启动 Clicker for HBO Max 即可开始狂欢。...测试系统: Big sur 11.3 Clicker for HBO Max mac版功能特色 直接从 Dock 启动 HBO Max 一键,就是这样。 不再在浏览器选项卡之间切换。...带视频控制画中画 多任务处理? 借助内置画中画支持,您可以在浏览TPS报告时观看自己喜欢视频。 只是不要让老板抓住你! 另外,与其他PiP窗口不同,从PiP窗口控制视频播放。...真正全屏视频播放 与 HBO iPad 应用程序不同 停止尝试在您 M1 Mac 上使用 HBO 愚蠢 iPad 应用程序,并使用 Clicker for HBO Max 享受真正全屏播放荣耀...使用配置文件自动跳过,选择您配置文件一次,然后应用程序将每次自动选择该配置文件,直到您更改为不同配置文件。就像魔术一样! 根据喜好定制

1.1K30

苹果拒绝支持PWA行为对Web贻害无穷!

渐进式 Web 应用就是 Web 应用,一种在移动设备上比原生应用能够无缝工作Web应用。 我立刻想到,“既然他做出了如此大胆声明,那么不用iOS吗,甚至永远也不会用?”...以下功能是你无法在移动版 safari 上做事情,因为苹果拒绝支持它们: 创建应用程序加载屏幕 使用推送通知 添加离线支持 创建一个初始应用程序UI来实现即时加载 通过浏览器引导对话框,提示安装到主屏幕...我在移动版 Safari 全屏”或“Web应用”模式中发现一些bug包括: 加载屏幕不起作用(及其恶劣——已经超过18000点击量,没有得到苹果回应。...固定标题闪烁(我最大心病,这就是为什么我最终在自己产品上( brewlog.com )禁用它原因) 在 300ms 延迟终于从移动版 Safari 中移除,却没有在全屏模式下移除(Apple没有回应...而且很容易找出原因: 苹果对待Web应用就像二等公民一样,因为它们不会在 app store 中像原生应用那样赚钱。 必须明确告诉用户如何将你应用程序添加到主屏幕上,这是一件可怕事情。

1.8K30

Android 9 Pie新版本入门

这是因为这些新特性要到秋季才会正式发布(谷歌硬件事件通常发生在10月初,对这个日期来说似乎是个不错选择)。 不过,让我们来讨论一下升级到Android 9 Pie将获得特性。...你现在也可以在home键上滑动,查看你最近使用应用程序全屏预览,以及一些谷歌认为你想要使用应用程序名称。再刷一遍,你就会看到你安装所有应用列表。...我确信谷歌使用某种机器学习来支持这些建议,但我宁愿把这个区域作为扩展最爱栏,在那里我可以锁定一些额外应用。...但在这里,也真正在日常使用真正区别是,文本选择放大镜显示了一个更大、更清晰图片让你选择(它位于你右上方选择),这使得你更容易选择正确文本(是的,iOS已经有类似的功能)。...我很期待这款应用程序,因为它允许开发者在Android Pie搜索栏中高亮显示他们部分应用程序(或许可以开始播放一首歌或者叫一辆车)。

1K30

自动化-Appium-​第一个Demo-混合(Python版)

不要停止应用程序,不要清除应用程序数据,也不要卸载apk # IOS 测试不要销毁或关闭SIM卡。...不要停止应用程序,不要清除应用程序数据,也不要卸载apk # IOS 测试不要销毁或关闭SIM卡。...根据所要使用Appium服务,拷贝到Appium Server或者Appium Desktop相应目录下即可。拷贝完成,就可以正常使用了。...根据所要使用Appium服务,拷贝到Appium Server或者Appium Desktop相应目录下即可。拷贝完成,就可以正常使用了。...方式二:通过ios_webkit_debug_proxy工具 首先将模拟器上应用程序打开,之后打开此应用显示Webview页面; 之后在Mac上打开终端,输入启动代理命令 ios_webkit_debug_proxy

2.4K20

《深入浅出Dart》Flutter环境安装与配置

访问Dart官方网站下载页面,选择适合版本进行安装。 安装IDE Flutter支持多种IDE,包括IntelliJ IDEA,Android Studio,和VS Code。...这意味着你Flutter环境已经准备好了,可以开始开发Flutter应用了。 模拟器 模拟器可以模拟Android或iOS设备环境,让你能够在开发机器上直接测试和调试你Flutter应用程序。...Xcode:(mac推荐)你可以通过Xcode"Preferences > Components"菜单来安装iOS模拟器。你需要下载你需要iOS模拟器版本。 2....运行应用程序 当你模拟器运行时,你就可以在模拟器上运行你Flutter应用程序。你可以通过flutter run命令来启动你应用程序。此命令会自动检测并在运行模拟器上启动你应用程序。...升级Flutter版本:如果你想升级到最新版本,可以运行flutter upgrade命令。此命令会自动下载并安装最新版本Flutter SDK。

35530
领券