Зафиксированная форма на странице сайта
Форма при скроллинге вниз всегда на виду.
Как реализовать зафиксированную форму
Разметка HTML:
<div class="row">
<div class="col-12- col-lg-5">
<div class="as-form" data-code="watch_bg" data-itemid="0"></div>
</div>
<div class="col-12- col-lg-7">
<div class="as-table" data-code="watch_tableFooter"></div>
<div class="as-table" data-code="watch_tableFooter"></div>
<div class="as-table" data-code="watch_tableFooter"></div>
<div class="as-table" data-code="watch_tableFooter"></div>
<div class="as-table" data-code="watch_tableFooter"></div>
</div>
</div>
Стили:
@media (min-width: 975px) {
.as-form[data-code=watch_bg]{
position:fixed;
}
}
Примечание: для малых экранов фиксация не нужна, поэтому используются media - правило работает только для экранов более 975 пикселей.
Другие демостенды
— Цвет фона формы. Как изменить фон формы на сайте— Горизонтальный скроллинг на телефоне - прокрутка панелей вправо на мобильном экране
— Красивые панели для выделения информации
Что есть в базе знаний по этой теме
— Как выводить разные данные на одной форме для разных ролей— Установка фоновой панели для формы
— Как сделать липкую панель сверху страницы
— Панели с тенью и со скруглением
— Как сделать дизайн сайта со скругленными элементами (или без скруглений)
— Как сделать модальное окно определенной ширины
Последние обновления
Интеграции 24.11.2025
Разное 24.11.2025
Форма 15.11.2025
Визуализация 02.11.2025
Таблица 08.10.2025
Форма 26.09.2025
Таблица 23.09.2025
Разное 23.08.2025
Таблица 21.08.2025
Форма 20.08.2025
Таблица 18.08.2025
Таблица 21.06.2025
Форма 07.06.2025
Форма 29.03.2025
Форма 17.02.2025
Файлы и документы 10.01.2025
Форма 01.11.2024
Форма 23.10.2024
SQL-инструмент для создания личных кабинетов на сайте
Платформа Falcon Space
Это снижение стоимости владения
за счет меньшего количества людей для поддержки
Это быстрое внесение изменений
по ходу эксплуатации программы
Это современный интерфейс
полная адаптация под мобильные устройства