Иван Журавлев

Question

Железо

Простой

Как организовать RGB-освещение рабочего места?

3 подписчика
более трёх лет назад
316 просмотров

0

ответов

Answer 1 · 2022-01-17 07:08:18

Для блока который нужно фиксировать задаёте position: fixed (+ top, right, bottom, left при необходимости). Для контейнера в котором находится фиксированный элемент (или body) задаёте padding-top равный высоте фиксированного элемента.
Данные свойства можно назначать элементам динамически с помощью JavaScript или jQuery, если у вас адаптивный дизайн.

window.addEventListener('resize', function(event) {
    ...
}, true);

или

window.onresize = function(event) {
    ...
};

Внутри данных функций при загрузке страницы (см. addEventListener('DOMContentLoaded')) обычно я высчитываю высоту фиксируемого блока и потом назначаю этот размер для padding-top нужного мне родителя. Это позволяет корректно отображать контент при изменении ширины окна.
На основе этой идеи также делается "липкий блок", когда нужно, чтобы элемент становился фиксированным при перелистывании страницы в определённый момент. Здесь стоит использовать cвойство scrollTop.