Как добавить анимацию (эффект медленной прокрутки) в этот код - PullRequest
0 голосов
/ 16 января 2020

Как добавить анимацию (эффект медленной прокрутки) к этому коду. В настоящее время его просто переход к следующему разделу, когда я прокручиваю вниз

window.onload=function(){

    //initialize
    var winHeight = $(window).height(),
    pages = $('.page'), 
    navLinks = $('#menu-nav a'),
    currentPage = 0;

    $('html, body').animate({ scrollTop: 0}, 0);

    $(window).on('mousewheel DOMMouseScroll', function(e){
    var direction = 'down',
      $th = $(this),
      currentPageOffset = currentPage * winHeight;

    if (e.originalEvent.wheelDelta > 0 || e.originalEvent.detail < 0) {
      direction = 'up';
    }

    if(direction == 'down' && currentPage <= pages.length - 2){
      $th.scrollTop(currentPageOffset + winHeight);
      currentPage++;
    } else if(direction == 'up' && currentPage > 0) {
      $th.scrollTop(currentPageOffset - winHeight);
        currentPage--;
    }
    });

    navLinks.each(function(index){
    $(this).on('click', function(){
      navLinks.parent().removeClass('current');
        $(this).parent().addClass('current');
    currentPage = index;
      });
    });
        }

1 Ответ

0 голосов
/ 16 января 2020

Вы можете сделать это, используя CSS, используя свойство scroll-поведения, например:

    html{
     scroll-behavior: smooth;
    }

Однако это не поддерживается Safari или IE.

См. https://css-tricks.com/almanac/properties/s/scroll-behavior/ для получения дополнительной информации.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...