LinkedIn
Behance
Максим Постников
© 2025 Максим Постников. Все права защищены.
Ru
En

Расширенный автоскейл

Сокращает время на вёрстку — добавляет автоскейл с уменьшением, масштабирование страницы по своим брейкпоинтам и позволяет масштабировать стандартные блоки.
Модификация
Модификация

Автоскейл для Zero‑блоков

Инструкция по установке
  • Cкопируйте код ниже и вставьте его внутрь <head> в настройках сайта
    Этот скрипт устанавливается только один раз и помогает модификациям работать. Если он уже стоит у вас на сайте, добавлять его снова не нужно, просто пропустите этот шаг.
<script src="https://cdn.postnikovmd.com/tilda@1.4/mods.min.js"></script>
Скопировать код
Код скопирован!
Синхронизация обновлений включена. Новые версии и исправления будут устанавливаться автоматически.
Синхронизация обновлений отключена. Текущая версия останется неизменной, независимо от обновлений.
  • Включите автоскейл в настройках Zero-блоков
  • Задайте в настройках модификации минимальный и максимальный брейкпоинт, относительно которых будет работать кастомный автоскейл
  • Скопируйте код и вставьте его в блок T123 в конец страницы
Как это сделано?
<script>rescale.init({ min: 360, max: 480, direction: "upscale" })</script>
<script>rescale.init({ min: 480, max: 1440, direction: "downscale" })</script>
<script>rescale.init({ min: 1440, keep: 1920, direction: "upscale" })</script>
Этот код масштабирует страницу по заданным брейкпоинтам – 360, 480, 1440 и 1920px. Для того, чтобы применить масштабирование сразу к нескольким адаптивам, мы задублировали код и указали соответствующие брейкпоинты каждому из них. Экраны в настройках Zero-блоков могут отличаться от тех, что заданы в модификации, подстраивать их необязательно. В данном примере в настройках стоят 320, 480 и 1200px.

Для работы модификации в настройках всех блоков должен должен включен автоскейл. Убеждаемся, что он работает и размещаем код в самом конце страницы.
Настройки модификации
Настройки модификации
Минимальная ширина экрана, от которой будет работать модификация.

Можно задать любое значение в рамках одного адаптива (например, для экранов 320–480px)
Направление масштабирования:
Минимальный брейкпоинт:
Максимальный брейкпоинт:
Максимальная ширина экрана, до которой будет работать модификация.

Можно задать любое значение в рамках одного адаптива или оставить пустым
<!--rescale.js Расширенный автоскейл. https://postnikovmd.com/mods/rescale-->
<script>rescale.init('.t-rec')</script>
Скопировать код
Скопировать код
Код скопирован!
Особенности
  • Собственные брейкпоинты
    Блоки скейлятся по любой ширине, независимо от значений в настройках
  • Применяется ко всей странице
    Свои параметры автоскейла будут работать для всей страницы
  • Работает с любыми блоками
    Мод позволяет масштабировать как Zero, так и стандартные блоки

Документация

Параметры
Чат для дизайнеров
Вместе всё получится
3 000+ человек
Присоединяйтесь ко мне в Telegram-канале!
Чтобы узнавать о новых модификациях и получать оперативную тех. поддержку
t.me/postnikovmds
Можете меня поблагодарить
Если у вас есть желание поблагодарить автора за работу, можете отправить любую сумму на развитие проекта
Присоединяйтесь ко мне в Telegram-канале!
Чтобы узнавать о новых модификациях и получать оперативную тех. поддержку
t.me/postnikovmds
 
Столкнулись с ошибкой?
Расскажите подробнее о проблеме, при которой модификация не работает или работает неправильно
Хотите получить ответ по проблеме? Напишите напрямую на почту hello@postnikovmd.com или в Telegram
Хотите получить ответ по проблеме? Напишите напрямую на на почту или в Telegram
Расскажите подробнее о проблеме, при которой модификация работает неправильно
Сообщение отправлено
Спасибо за обращение! Мы провалидируем ошибку и исправим её в ближайшее время
Нравятся модификации?
Поделитесь впечатлениями от работы с библиотекой — обратная связь поможет нам стать лучше
Поделитесь впечатлениями о сервисе — обратная связь поможет нам стать лучше
Сообщение отправлено
Спасибо, что делитесь с нами! Это помогает нам развиваться и улучшать сервис
Максим Постников | Дизайн...
Отключение автоскейла для для отдельных браузеров/устройств
27
20 фев в 12:00
120