Хтось знає найбезпечнішу ширину та висоту для ТІЛЯ під час перегляду будь-якої веб-сторінки на iPad? Я хочу максимально уникати смуг прокрутки.
Дякую.
Ерік
Відповіді:
Ширина пікселя та висота вашої сторінки залежатимуть від орієнтації, а також теги метаполе перегляду, якщо вони вказані. Ось результати запуску $ jquery $ (window) .width () та $ (window) .height () у браузері iPad 1.
Коли на сторінці немає тегу метапогляду перегляду:
Коли на сторінці є один із цих двох метатегів:
<meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,width=device-width">
<meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1">
З <meta name="viewport" content="width=device-width">:
З <meta name="viewport" content="height=device-height">:
З <meta name="viewport" content="height=device-height,width=device-width">:
З <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,width=device-width,height=device-height">
З <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,height=device-height">
На це питання немає простої відповіді. Мобільна версія Apple WebKit, яка використовується в iPhone, iPod Touches та iPad, дозволить масштабувати сторінку відповідно до екрана, і в цей момент користувач може вільно збільшувати та зменшувати масштаб.
Втім, ви можете розробити свою сторінку, щоб мінімізувати необхідне масштабування. Ваша найкраща ставка - зробити ширину і висоту такою ж, як і нижча роздільна здатність iPad, оскільки ви не знаєте, на який напрямок вона орієнтована; Іншими словами, ви зробите свою сторінку 768x768, щоб вона добре вміщувалася на екрані iPad, незалежно від того, орієнтована вона на 1024x768 або 768x1024.
Що ще важливіше, ви хочете розробити свою сторінку великими елементами управління з великим простором, який легко вразити великими пальцями - ви можете легко створити сторінку 768x768, яка дуже захаращена і тому вимагає великого масштабування. Для цього ви, ймовірно, захочете розділити свої елементи управління на кілька веб-сторінок.
З іншого боку, це не найдостойніше переслідування. Якщо під час проектування ви знайдете можливості зробити свою сторінку більш "зручною для пальців", тоді перейдіть до цього ... але реально така ситуація, що користувачі iPad дуже зручні з переміщенням та збільшенням масштабу та зменшення сторінки, щоб дійти до речей, оскільки це необхідно на більшості веб-сайтів. Якщо що-небудь, ви, ймовірно, хочете спроектувати його так, щоб це сприяло даному типу навігації.
Створіть поля з відповідними згрупованими даними, які можна легко двічі торкнутись, щоб зосередитись, і тримати пов'язані елементи управління близько один до одного. Користувачі iPad, швидше за все, оцінять сторінку, яка сприяє звичній навігації зі збільшенням масштабу та панорамування, до якої вони звикли більше, ніж на сторінці, яка має менше елементів керування, тому їм не доведеться.
Ви можете спробувати це:
/*iPad landscape oriented styles */
@media only screen and (device-width:768px)and (orientation:landscape){
.yourstyle{
}
}
/*iPad Portrait oriented styles */
@media only screen and (device-width:768px)and (orientation:portrait){
.yourstyle{
}
}