javascript - 网站滚动问题

Question

我的网站滚动时遇到一些问题。看起来当您单击链接时，它们会转到正确的页面，但是如果您随后尝试上下滚动，它不会正确执行，它会跳到顶部。

例如，在我的页面上，如果您点击“开始您的冒险”，然后向上滚动，它就会跳转。与图像链接相同。

我试过添加 jquery smooth scroll https://raw.githubusercontent.com/kswedberg/jquery-smooth-scroll/master/jquery.smooth-scroll.js 然后是我网站上的以下 JS:

 $(document)
    .on('click', 'a[href*="#"]', function() {
      if ( this.hash && this.pathname === location.pathname ) {
        $.bbq.pushState( '#/' + this.hash.slice(1) );
        return false;
      }
    })
    .ready(function() {
      $(window).bind('hashchange', function(event) {
        var tgt = location.hash.replace(/^#\/?/,'');
        if ( document.getElementById(tgt) ) {
          $.smoothScroll({scrollTarget: '#' + tgt});
        }
      });

      $(window).trigger('hashchange');
    });

我不介意平滑滚动不起作用，只要用户可以正常滚动而不会跳动就很好

Answer 1

试试这个解决方案...

删除 smoothScroll 插件并尝试使用下面的代码..

添加 'inner-link' 类以锚定目标。

$('.inner-link').on('click', function(e) {
    var target = $(this.hash);
    if( target.length ) {
     event.preventDefault();
     $('html, body').animate({
         scrollTop: target.offset().top
     }, 1000);
     return false;
   }
  });