У меня есть веб-приложение для iPhone 3, использующее css3 & html5.Переход на iPhone 4 и отображение на сетчатке глаза был сложной задачей, даже после прочтения слов «CSS-пиксели» и «физические пиксели».
Мое веб-приложение создает довольно много страниц, которые «скрыты» отправая сторона экрана и кнопки на «домашнем экране» перемещают нужную страницу на экран.Я использую следующее преобразование, чтобы скрыть страницы за кадром:
-webkit-transform: translate3d(+100%,0,0)
Все хорошо работает на iPhone 3, но iPhone 4 отображает обе страницы рядом, я полагаю, потому что дисплей сетчатки в два раза шире.*
Я смог решить эту проблему, но изменил свой метатег с:
<meta name="viewport" content="width=device-width,user-scalable=no">
на:
<meta name="viewport" content="width=device-width, initial-scale=1.0,
minimum-scale=1.0, maximum-scale=2.0, user-scalable=no">
и использовал атрибут display, чтобы скрыть страницы за кадром:
display: none
но у меня все еще есть одна проблема, которую я не могу решить.На iPhone 3 вращение устройства в альбомной ориентации масштабирует текст больше.На iPhone 4 используется более широкий экран, но масштабирование текста не происходит.
Буду признателен за любые предложения,
Tia