CSS3: определение ориентации устройства для iPhone

Question

Так что это объявление отлично работает для iOS 4 и 4.1, но не для более старых версий. Любой совет?

@media screen and (device-width:320px) and (orientation:portrait) {
    /* iPhone Portrait Styles Here*/
}

@media screen and (device-width:320px) and (orientation:landscape) {
    /* iPhone Landscape Styles Here*/
}

Answer 1

Да. Согласно документам MDN :

ориентация

Значение: ландшафт | портрет

Носитель: визуальный

Принимает мин / макс префиксы: нет

Указывает, находится ли область просмотра в альбомной ориентации (дисплей шире чем он высокий) или портретный (дисплей выше, чем широкий) режим.

Пример * +1026 *

Чтобы применить таблицу стилей только в портретной ориентации:

@media all and (orientation: portrait) { ... }

Примечание: Это значение не соответствуют фактической ориентации устройства. Открытие мягкой клавиатуры на большинстве устройств в портретной ориентации окно просмотра становится шире, чем высота, в результате чего браузер использует Пейзажные стили вместо портретного.

Answer 2

мы используем javascript для этого, аналогично этому:

Может ли js / jQuery определять ориентацию iPhone?