window.innerWidth / Высота и резиновая лента
Что я хочу:
Я пытаюсь выяснить эффективный размер области просмотра моей веб-страницы на разных устройствах - поэтому размер, доступный для содержимого на экране, без строк состояния и прочего.
Что я пробовал:
screen.availWidth/screen.availHeight- Кажется, это на самом деле захватывает размер окна браузера или что-то. В любом случае строка состояния и прочие вещи есть в этом.JQuery-х
$(document).width()/$(document).height()- очевидно, не работает, потому что он дает размер всего документа, я просто хочу в окне просмотра.JQuery-х
$(window).width()/$(window).height()- UI, кажется, также будет включен в это. Кроме того, это иногда дает действительно странные результаты на iOS в ландшафтном режиме (на моем iPad 2 ширина и высота оба возвращают 1024 - странно!)window.outerWidth/window.outerHeight- кажется, такой же, как$(window)двойникиwindow.innerWidth/window.innerHeight- похоже, это путь, но есть одна серьезная проблема, которую я сейчас опишу.
Почему window.innerX не работа?
Большая проблема, по крайней мере на iOS 7, заключается в: резиновых полосах. Например, если я определю innerHeight в то время как некоторые резиновые полосы в настоящее время происходят, значение слишком мало - кажется, что область резиновых полос (серая область во время резиновых полос) вычитается из innerHeight что фактически делает это совершенно бесполезным для меня, так как я пытаюсь получить это значение во время сенсорного события. Я не нашел способа предотвратить это (кроме отключения резиновых полос) и способа найти текущий размер области резиновых полос или что-то в этом роде. offsetTop кажется, 0, так что резиновых полос там нет.
Есть идеи, как решить эту проблему? Любой хороший способ получить фактический размер области просмотра как в портретной и альбомной ориентации?
Обновление / Решение
Я не нашел решения проблемы резиновой ленты с innerWidth / Height но похоже что jQuery $(window).width() / height() обычно дает размер области просмотра. Причина, по которой это не сработало для меня, была в том, что я использовал height=device-height в метатеге области просмотра. Пропуская это, возвращаемые значения, кажется, в значительной степени то, что я хотел.