1. / 
2. JavaScript
3. Скрипт плавного перехода к элементу на странице

Скрипт плавного перехода к элементу на странице

Часто на лэндинге возникает необходимость перехода к форме заказа по клику на ссылке.
Данный скрипт изменяет стандартный переход по ссылке на плавное перемещение по странице к элементу. В нашем случае к элементу с id=«orderform».

<script>
  $(document).ready(function() {
    $('a').on('click',function(e) {
      if (!$(this).hasClass("no-jump")) {
        $('html, body').stop().animate({
          scrollTop: $('#orderform').offset().top
        },777);
        e.preventDefault();
        return false;
      }
    });
  });
</script>

Внимательные заметили, что данный скрипт игнорирует ссылки с class=«no-jump». Это удобно, если вам нужно сохранить стандартный переход по ссылке, например, к страницам report или policy.

// Любая ссылка на странице
<a href="link">Go to Order Form!</a>
...
// Форма, к которой будет выполнен плавный переход
<form id="orderform" action="api.php" method="POST">...</form>
...
// Ссылка, которую скрипт проигнорирует
<a href="report.html" class="no-jump">Report</a>

Написать комментарий