Заставка для веб-приложения iPad3 не работает в альбомном

Question

Я построил веб-приложение HTML5 для iPad, которое использовало заставку для ландшафтного и портретного режима.Я использовал приведенные ниже теги ссылок, чтобы заставить его работать.

<link media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)" href="{{MEDIA_URL}}ipad/img/Default-Landscape.png" rel="apple-touch-startup-image"/>
<link media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)" href="{{MEDIA_URL}}ipad/img/Default-Portrait.png" rel="apple-touch-startup-image"/>

Изображения хорошо работают для iPad1 и 2, однако, с iPad3 заставка в альбомном режиме выглядит неуместно, портретный режим работает нормально.Нужно ли использовать другое изображение для альбомного режима или изменить тег ссылки?

Answer 1

Размер для изображений запуска iPad с высоким разрешением (в пикселях):
1536 х 2008 (портрет)
2048 x 1496 (пейзаж)
Источник: яблоко

Добавьте это к вашему медиа-запросу:
и (-webkit-min-device-pixel-ratio: 2) для таргетинга на новый iPad, например:

<link rel="apple-touch-startup-image" href="img/ipad-landscape-retina.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) and (-webkit-min-device-pixel-ratio: 2)" />