Плавная прокрутка к блоку jquery

266

04 апреля 2018, 09:10

Меню фиксированное при прокрутке закрывает собой верх блока. что в jquery добавить чтобы добавить отступ

<ul class="horizontal-nav trigger-victim">
            <li><a href="#!" class="active go_to">Главная</a></li>
            <li><a href="#catalog" class="go_to">Каталог</a></li>
            <li><a href="#about" class="go_to">О компании</a></li>
            <li><a href="#delievery" class="go_to">Доставка и оплата</a></li>
            <li><a href="#contacts" class="go_to">Контакты</a></li>
        </ul>

   $(document).ready(function(){
        $('.go_to').click( function(){ // ловим клик по ссылке с классом go_to
      var scroll_el = $(this).attr('href'); // возьмем содержимое атрибута href, должен быть селектором, т.е. например начинаться с # или .
            if ($(scroll_el).length != 0) { // проверим существование элемента чтобы избежать ошибки
          $('html, body').animate({ scrollTop: $(scroll_el).offset().top }, 500); // анимируем скроолинг к элементу scroll_el
            }
          return false; // выключаем стандартное действие
        });
    });

Answer 1

Отдельная переменная offset которая даст отступ

$(document).ready(function(){
    $('.go_to').click( function(){ // ловим клик по ссылке с классом go_to
  var scroll_el = $(this).attr('href'); // возьмем содержимое атрибута href, должен быть селектором, т.е. например начинаться с # или .
  var offset = 80;
        if ($(scroll_el).length != 0) { // проверим существование элемента чтобы избежать ошибки
      $('html, body').animate({ 
      scrollTop: $(scroll_el).offset().top-offset
      }, 
      500); // анимируем скроолинг к элементу scroll_el
        }
      return false; // выключаем стандартное действие
    });
});