Benny_Lilom
@Benny_Lilom
junior front-end developer

Как сделать при загрузке отображение сайта 480px на iphone(320px), чтоб масштаб подстраивался сразу как надо?

Здравствуйте!
В проекте присутствует адаптив, но дизайн минимум на 480рх, сделал адаптив все как надо, но на iphone (так же других устройствах у которых ширина меньше 480рх) отображается обрезанная страница, пока не уменьшишь масштаб.
Как сделать, чтоб при загрузке сразу подстраивался масштаб как надо?
  • Вопрос задан
  • 218 просмотров
Решения вопроса 1
ogarich89
@ogarich89
Front-End Developer
Держи отец! Проверено.
<head>
  <script>
      var metaTag=document.createElement('meta');
      metaTag.name = "viewport";
      if (screen.width <= 479) {
          metaTag.content = "width=480, user-scalable=false"
          window.addEventListener("orientationchange", function() {
              viewport = document.querySelector("meta[name=viewport]");
              if(window.orientation === 90 || window.orientation === -90){
                  viewport.setAttribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=false');
              } else{
                  viewport.setAttribute('content', 'width=480, user-scalable=false');
              };
          }, false);
      } else{
          metaTag.content = "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=false"
      };
      document.getElementsByTagName('head')[0].appendChild(metaTag);
  </script>
</head>
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@Cnfc19932
Full-stack web developer
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы