ios - iPad Web 应用启动画面在横向模式下无法工作

Question

我已经阅读了无数关于此的主题、博客文章和其他在线文档，但我无法让它工作。我花了几个小时研究这个并尝试不同的东西。

我正在尝试为 iPad 2 上的网络应用程序获取启动画面图像。我什至不关心 iPad 3 的分辨率。

这些是我拥有的标签:

<link href="images/splash_748.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)" rel="apple-touch-startup_image">
<link href="images/splash_768.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)" rel="apple-touch-startup-image">

splash_748.png 是 748x1024

splash_768.png 是 768x1004

肖像模式启动画面工作得很好。横向版本不会显示。有人有什么想法吗？我已经尝试了十几种不同的方法来做到这一点。他们都没有工作。

每次更新时，我都会删除应用程序并清除 Safari 的缓存。然后我返回网页并将其发送到主屏幕。这似乎可以获取图像中的变化，所以我无法想象它正在缓存其他任何内容。

Answer 1

您的代码中有错误。看第一行结尾

rel="apple-touch-startup_image"

应该是

rel="apple-touch-startup-image"

注意 _ 应该是 -

编辑:这是我的 iOS 网络应用程序代码 - 涵盖了大多数情况，似乎适用于大多数设备，但不要让我坚持下去:)

<!-- iOS Device Startup Images -->
<!-- iPhone/iPod Touch Portrait – 320 x 460 (standard resolution) -->
<link rel="apple-touch-startup-image" href="images/ios/iphone-startup-320-460.png" media="screen and (max-device-width: 320px) and (-webkit-min-device-pixel-ratio: 1)" />

<!-- iPhone/iPod Touch (high-resolution) Portrait – 640 x 920 pixels -->
<link rel="apple-touch-startup-image" href="images/ios/iphone-startup-640-920.png" media="screen and (max-device-width: 320px) and (-webkit-min-device-pixel-ratio: 2)" />

<!-- iPad Landscape 1024x748 -->
<link rel="apple-touch-startup-image" sizes="1024x748" href="images/ios/ipad-startup-1024-748.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) and (-webkit-min-device-pixel-ratio: 1)" />

<!-- iPad Portrait 768x1004 -->
<link rel="apple-touch-startup-image" sizes="768x1004" href="images/ios/ipad-startup-768-1004.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) and (-webkit-min-device-pixel-ratio: 1)"/>

<!-- iPad (high-resolution Landscape – 2048 x 1496 pixels ) -->
<link rel="apple-touch-startup-image" sizes="2048x1496" href="images/ios/ipad-startup-2048-1496.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) and (-webkit-min-device-pixel-ratio: 2)" />

<!-- iPad (high-resolution) Portrait – 1536 x 2008 pixels -->
<link rel="apple-touch-startup-image" sizes="1536x2008" href="images/ios/ipad-startup-1536-2008.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) and (-webkit-min-device-pixel-ratio: 2)" />

<!-- iOS Icons -->
<link rel="apple-touch-icon" href="images/ios/icon-57.png" />
<link rel="apple-touch-icon" sizes="72x72" href="images/ios/icon-72.png" />
<link rel="apple-touch-icon" sizes="114x114" href="images/ios/icon-114.png" />
<link rel="apple-touch-icon" sizes="144x144" href="images/ios/icon-144.png" />