Как сделать - Липкий элемент
Узнать, как создать липкий элемент с помощью CSS.
Примечание: Этот пример не работает в Internet Explorer или Edge 15 и более ранних версиях.
Липкий элемент
Элемент с position: sticky;
позиционируется в зависимости от положения прокрутки пользователя.
Липкий элемент переключается между relative
и fixed
, в зависимости от положения прокрутки. Он позиционируется относительно до тех пор, пока заданная позиция смещения не будет встречена в окне просмотра - тогда она "прилипает" на месте (например, position:fixed).
Примечание: Internet Explorer, Edge 15 и более ранние версии не поддерживают липкое позиционирование. Для Safari требуется префикс -webkit- (см. пример ниже). Также необходимо указать хотя бы один из следующих параметров top
, right
, bottom
или left
для липкого позиционирования, чтобы работать.
Чтобы узнать больше о позиционировании CSS, прочитайте наш учебник CSS Позиция.