🔥 Новая модификация: Система скролл-эффектов!

Смещение при переходе на якорную ссылку для 5-ти разрешений

Работает, если на сайте используется блок T173 «Якорная ссылка». Используй смещение, если на сайте есть фиксированное меню и при этом высота меню отличается на различных разрешениях. Тогда меню не будет перекрывать контент, когда пользователь перешел по якорной ссылке.

Как сделать

  • Настрой смещение в генераторе, например: 110px или -160px
    Укажи смещение для каждого разрешения. Можно использовать положительные и отрицательные значения. Вписывай значение вместе с единицей измерения.
  • Установи код на сайт, например в блок T123
    Скопируй готовый код и вставь его на сайт, памятка по вставке кода.
<!-- https://romanyu.ru/smeshchenie-yakornaya-ssylka -->
<style>
[data-record-type="215"] {
    /* Укажи величину смещения для разрешения больше 1200px */
    top: -160px;
    position: relative;
}
@media (max-width: 1199px) {
    [data-record-type="215"] {
        /* Укажи величину смещения для разрешения 961-1200px */
        top: -110px;
        position: relative;
    }
}
@media (max-width: 959px) {
    [data-record-type="215"] {
        /* Укажи величину смещения для разрешения 641-960px */
        top: -110px;
        position: relative;
    }
}
@media (max-width: 639px) {
    [data-record-type="215"] {
        /* Укажи величину смещения для разрешения 481-640px */
        top: -75px;
        position: relative;
    }
}
@media (max-width: 479px) {
    [data-record-type="215"] {
        /* Укажи величину смещения для разрешения меньше 480px */
        top: -75px;
        position: relative;
    }
}
</style>
Понравилось решение?