Jump to content
  • 0

Заставить iOS нормально отображать страницу сразу по загрузке

adelante

Asked by adelante,

 Share

Question

adelante Explorer

adelante

Posted
Posted

Здравствуйте. Страница имеет body{width: 1500px} и <meta name="viewport" content="width=1500">. По моим представлениям того, как работает viewport, при загрузке страницы она должна быть видна во всю ширину. Реально же, похоже, так получается только если iPhone/iPad так сказать в landscape mode, повёрнутый набок. В вертикальном же положении имеет подобную картину:

 

image.png

 

Я пробовал также экспериментировать с initial-scale и ещё с чем-то, но вот лучше этого, что есть, пока ничего не получилось. Есть ли идеи у кого-нибудь, как пофиксить это дело?

Link to comment
Share on other sites

2 answers to this question

Recommended Posts

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to question listing

  • Similar Content

    • Full-R
      View port units интерфейс через Web View
      By Full-R
      В общем свежая безумная идея сделать интерфейс на VPU(view port units) таким образом чтобы избежать media queries.
      Сейчас сделано определение мобильной версии браузера и на CSS4 vars сделаны переключатели масштаба элементов интерфейса.
      Поскольку дизайн полностью масштабируется под размер окна и не нужны ни какие костыли и сетки, я хочу добавить в свой фреймворк такую опцию, как автоматическая генерация Android приложения, которое бы работало на Web View. У нас уже везде webkit и можно было бы сделать заготовку приложения, которая бы скрывала строку ввода адреса браузера, но оставляла возможность поменять URL, на который обращается приложение.
      Я не пишу под андроид и мне бы очень не помешал пример такого приложения с возможностью на сервере через PHP поменять иконку и URL.
      Интерфейс у меня написан полностью динамический на ECMA Script fetch и вместе с SVG графикой весит примерно 300Кб не сжатого сервером кода, что гораздо лучше, чем разрабатывать отдельное приложение для mobile web.
      Мой проект RevolveR CMF: https://revolvercmf.ru/ (сайт сообщества, на котором пока ни чего нет - просто чтобы протестировать интерфейс на VPU и SPAx).
      Видео обзор системы: 
       
       
      Дистрибутив для установки вот здесь: https://github.com/Full-Rx/RevolveR-framework/releases/tag/1.9.2.x
      Группа на facebook тут: https://www.facebook.com/groups/331465761595917
      Фреймворк позиционируется, как замена Drupal и предоставляет широкий спектр функций для создания сайта сообщества.
      Интерфейс написан самостоятельный с чистого листа на ECMA Script 7, а backend реализован на PHP SPL 7.4. Для базы данных реализован мощный кэш с шифрованием и система оптимизирована под высокие нагрузки.
      Сам интерфейс легко меняется с помощью CSS, что позволяет не сильно модифицировать шаблон при создании своей темы оформления.
      Хочу подсказать как лучше реализовать View Port Unit интерфейс, который сейчас работает через calc просто подменяя значение переменной для масштабирования элементов под мобильные устройства. Дело в том, что сейчас уже не нужны ни какие media queries и grids(сетки), а также нет нужды во flex-box так как VPU прекрасно позволяют реализовывать интерфейс для любых дисплеев так, что он смотрится одинокого, как это сделано в операционной системе Windows, например.
       
      Давайте покумекаем, как мы можем это использовать для современных интерфейсов, чтобы сэкономить себе время на создание верстки и дизайна. Мне кажется моя идея выгорает хотя бы экономией времени и денег на создании мобильного приложения. 
       
    • sdanilas
      2 viweport для страницы (или аналогичный эффект)
      By sdanilas
      Дизайнер клиента придумал такой креатив. Есть 2 макета страницы - мобильный вид (320 px) и десктопный (1440 px).
      По его задумке, на устройствах до портретной ориентации планшетов должен показываться мобильный вид. Т.е. открываем на ipad в портретной ориентации - видим на весь экран мобильный вид. Открываем на десктопе или ipad в ландшафтном положении - видим десктопный. При этом нет адаптива - оно всё должно просто zoom-иться (как будто я неадаптивный сайт смотрю с указанным для него viewport) - т.е. на упомянутом ipad страница уменьшается чтобы вписаться в устройство. Такое вообще реализуемо? Два viewportа прописать, понятно, нельзя. Менять его от @media - тоже. Можно, наверное, извратиться, и подменять его через JS под размер окна браузера пользователя, но это как-то не правильно, ИМХО.
      Может быть есть какие-то другие приёмы?
    • VeraVostro
      Адаптивная верстка — ширина экрана больше чем ширина содержимого страницы
      By VeraVostro
      Помогите, пожалуйста, очень нужен взгляд со стороны.

      Проблема следующая - страница нормально отображается в десктопной версии, при ресайзе окна - тоже все ок. Но в режиме эмуляции моб. устройств ширина экрана больше чем ширина содержимого страницы. При этом проблема только в chrome firefox отображает нормально в любом режиме.

      Ниже скрин (режим моб. устройств).
      Код можно посмотреть здесь.

    • INVOLTA
      Involta. Приглашаем PHP, JavaScript, C/C++, Xamarin, Java, Swift разработчиков
      By INVOLTA
      Программист PHP  (заработная плата от 20 000 до 90 000 руб.)
      Должностные обязанности: 
      • Разработка веб-проектов любой сложности
      Требования:
      • Опыт разработки высоконагруженных проектов как на чистом PHP, так и на фреймворках;
      • Опыт разработки с использованием ООП;
      • Опыт работы с реляционными и нереляционными базами данных (проектирование, оптимизация, администрирование);
      • Знание математики: мат. логика, теория вероятности, мат. анализ, статистика, мат. статистика;
      • Параллельное программирование;
      • Приветствуется опыт работы с рекламными сетями или общее представление как они работают.
       
      Разработчик JS (заработная плата 25 000 – 150 000 руб.)
      Должностные обязанности:
      • Проектирование систем средствами JavaScript
      Требования:
      • Отличное знание JavaScript (особенно ООП) и особенностей браузеров, опыт работы от 1 года;
      • Отличное владение jQuery; знание других фреймворков и принципов их работы также приветствуется;
      • Умение разделять код JS на модули. Желателен опыт работы с большими проектами.
       
      Программист С/С++  (заработная плата от 25 000 до 150 000 руб.)
      Должностные обязанности:
      • Разработка ПО средствами C/C++
      Основные требования:
      • Хорошее знание С++;
      • Знание основных алгоритмов и структур данных;
      • Понимание принципов ООП, паттерны проектирования;
      • Знание STL/Boost.
      Будет плюсом:
      • Знание Linux и опыт работы с GCC;
      • Навыки работы с системами контроля версий (GIT, SVN);
      • Использование современных стандартов C++11/14, современных практик программирования;
      • Уверенное владение ООП, паттернами проектирования, опыт работы с многопоточностью;
      • Навыки отладки, профилирования и оптимизации кода;
      • Устойчивая привычка проверять свой код, покрывать его юнит-тестами, проводить рефакторинг;
      • Наличие опыта коммерческой разработки на других языках программирования (C#/Java);
      • Опыт разработки высокодоступных сервисов (24/7).
       
      Разработчик мобильных приложений (Xamarin, Java, Swift) (заработная плата от 40 000 до 100 000 руб.)
      Должностные обязанности:
      • Разработка мобильных приложений на Xamarin/Android/iOS;
      • Адаптация технического задания, прототипирование и тестирование приложений;
      • Оптимизация взаимодействия приложений и серверной части.
      Требования:
      • Знание и опыт работы с Xamarin, понимание Xamarin.Forms;
      • Уверенное знание одной из мобильный платформ: iOS, Android;
      • Опыт разработки мобильных приложений на Android, iOS платформе;
      • Опыт работы c реляционными базами данных, такими как SQLite, проектирование баз данных;
      • Необходимые знания: Java, Swift, C#, Android SDK, Google Cloud Platform.

      Уровень заработной платы обсуждается на собеседовании.
      От нас - гибкий график, лучшие зарплаты, комфортные условия, молодой коллектив, новый крутой офис, своя кухня, занятия по стрейчингу, IT- party и многое другое! 
      От Вас - желание развиваться, работать и зарабатывать! 
      ООО "ИНВОЛЬТА" 
      г. Иваново, пр. Строителей, д. 94, оф. 196
      тел. 8(930)356-45-98
      maria@involta.ru
      t.me/involta
      involta.ru
    • twentyfive_agency
      Разработка сайтов и мобильных приложений
      By twentyfive_agency
      Мы достаточная слаженная команда и работаем как единый механизм.
      Все члены команды обладают достаточной компетенцией, чтобы выполнять работы разного уровня сложности.
      Сейчас у нас в команде:
      4 Технолога/Верстальщика (html5, css3, javascript, reat, angular) 2 Проектировщика/Дизайнера (invision, photoshop, illustrator, sketch) 3 Бэкенд разработчика (php, nodejs, python + работа со всеми известными cms,crm-системами) 4 Мобильных разработчика (1 iOs, 1 Android) 2 Тестировщика Каждый из членов команды четко понимает ответственность за проект!
      Все задачи ведем в Basecamp, Trello и JIRA, и всегда добавляем туда заказчика, чтобы формировалась прозрачность работы.
      Процесс работы по проектам у нас такой:
      Получаем задание Оцениваем сроки и стоимость, предоставляем информацию в электронном виде заказчику. Согласуем эти данные или вносим корректировки. Подписываем договор (с нашей стороны ИП) Получаем аванс по договору Начинаем работу по проекту Ведем разработку проекта Показываем финальную итерацию заказчику и запускаем проект в продакшн. Остаемся довольными сотрудничеством и получаем отзывы по работе, слаженности и о качестве проекта в целом. Рейты работы наших специалистов:
      Проектирование/Дизайн // 700-800 руб/час Верстка/js  // 700-800 руб/час Программирование (бэкенд) // 700-1000 руб/час Тестирование // 400-650 руб/час Разработка приложений (iOS, Android) // 1000-1400 руб/час Мы работаем над тем, чтобы:
      Заказчик всегда был уверен в том, что сроки по проекту не выйдут за согласованные. Заказчик был уверен в том, что качество работ будет проведено на высшем уровне. Заказчик похвалил нас и сказал, что вернется еще или останется с нами на техподдержку. Наши работы:
      http://greenjam.ru http://tuborg.ru http://k1664.ru http://corny.ru http://megalabs.ru http://prostude.net http://ecorse.education http://eqeducation.org http://dadacreative.com http://tfg.ru/ http://pirelli.autonews.ru/ http://id-direct.ru http://localway.ru  
       
      Twenty Five Agency
      twentyfive.agency
      Georgy Pantsulaya, CEO
      via phone: +7-989-536-00-35
      via skype: hello@twentyfive.agency
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept