Как настроить не увеличивать масштаб на мобильном устройстве?
Вот тестовая ссылка:
Сайт сейчас точно такой, каким я хотел бы его представить, одна проблема, если я настрою
<meta name="viewport" content="width=device-width, initial-scale=1">
на мобильном телефоне это увеличит
И я попытался установить
<meta name="viewport" content="width=device-width, initial-scale=0">
Однако это повлияет на макет, и некоторые блоки переместятся в неправильное положение.
Итак, мне интересно, как установить, чтобы не увеличивать мобильный по умолчанию? Javascript/ JQuery также приветствуется, если мета не может удовлетворить потребности
Благодарю.
Обновить:
Спасибо за ответы.
Либо без прокрутки, максимальный масштаб =1, минимальный масштаб =1, начальная ширина по-прежнему является увеличенной версией и не может уменьшать масштаб в этот раз.
Извините за путаницу, идея в том, может ли ширина начинаться именно с ширины устройства? тогда это не увеличено
Или что мне нужно сделать, это увеличить до наименьшего масштаба.
3 ответа
Только что убрал initial-scale=1, тогда он не будет увеличивать
user-scalable Параметр должен это сделать.
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
В противном случае вы можете установить minimum-scale а также maximum-scale в 1.0
Использование масштабируемого пользователем атрибута
<meta name="viewport" content="width=device-width, user-scalable=no" />