【发布时间】:2013-06-21 00:06:34
【问题描述】:
我的网站使用 iOS Web App 元信息时遇到问题。我已经能够让它适用于所有设备,除了横向的 Retina iPad。由于我无法理解的原因,它只在左下角显示启动图像,就像它使用非 Retina 图像一样,但我不知道为什么。它适用于纵向。
这是我正在使用的代码:
<!-- Do NOT use width=device width because it will letterbox viewport on iPhone 5... thanks for making it easy Apple. -->
<meta name="viewport" content="initial-scale=1.0, user-scalable=yes">
<!-- iPhone 4 Retina -->
<link rel="apple-touch-startup-image" media="(device-width: 320px) and (-webkit-device-pixel-ratio: 2)" href="http://www.reckless-intent.com/assets/images/ios/iphone4.jpg">
<!-- iPhone 5 Retina -->
<link rel="apple-touch-startup-image" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" href="http://www.reckless-intent.com/assets/images/ios/iphone5.jpg">
<!-- iPad Retina Portrait -->
<link rel="apple-touch-startup-image" media="(device-width: 1536px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)" href="http://www.reckless-intent.com/assets/images/ios/ipadretinaport.jpg">
<!-- iPad Retina Landscape -->
<link rel="apple-touch-startup-image" media="(device-width: 1536px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2)" href="http://www.reckless-intent.com/assets/images/ios/ipadretina.jpg">
<!-- iPad Non-Retina Portrait -->
<link rel="apple-touch-startup-image" media="(device-width: 768px) and (orientation: portrait)" href="http://www.reckless-intent.com/assets/images/ios/ipadport.jpg">
<!-- iPad Non-Retina Landscape -->
<link rel="apple-touch-startup-image" media="(device-width: 768px) and (orientation: landscape)" href="http://www.reckless-intent.com/assets/images/ios/ipad.jpg">
如果您希望自己运行该网站,请访问 www.reckless-intent.com。我已经尝试清除我的缓存和 cookie。我没有其他 iPad 可以测试它是否被隔离。
非常感谢您的宝贵时间,我真的很感激 :)
【问题讨论】:
-
That's 第一次打开页面时的样子。我没有看到启动画面...
-
竖屏模式你试过了吗?
-
Same result ... 没有启动画面 ... 抱歉 ;(
-
是的,真的很奇怪。
-
我不确定视网膜 ipad 的视口是否与普通 ipad 不同。话虽如此,请尝试使用 768px 而不是 1536。