偏移平滑滾動引導程序JS

Question

我需要將平滑滾動偏移100px。到目前爲止，我有這樣的：

$(function() { 
 
    $('a.page-scroll').bind('click', function(event) { 
 
     var $anchor = $(this); 
 
     $('html, body').stop().animate({ 
 
      scrollTop: $($anchor.attr('href')).offset().top 
 
     }, 1500, 'easeInOutExpo'); 
 
     event.preventDefault(); 
 
    }); 
 
});

這得到了我的鏈接感動！但是我怎麼能添加.offset（）。top> 100呢？如果有人可以幫忙，我有問題想辦法解決。

Answer 1

聽起來像你有一個固定的導航欄。假設你的錨是空的：通過更新您的JavaScript

.anchor { 
    top: -100px; 
    position: relative; 
    display: block; 
} 

或者可以抵消scrollTop的：

<a class="anchor" id="foo"></a> 

只是抵消了CSS錨

scrollTop: $($anchor.attr('href')).offset().top - 100 

Answer 2

ve1jdramas你好。
看一看這個link here。

在這個例子中，他們使用+或-。

就像這個... scrollTop: target.offset().top -100
或
scrollTop: target.offset().top +100

試試這個，看看你是否能得到這個爲你工作。
或使用此完整的代碼。

$(function() { 
     $('a[href*=#]:not([href=#])').click(function() { 
     if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 

      var target = $(this.hash); 
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 
      if (target.length) { 
      $('html,body').animate({ 
       scrollTop: target.offset().top -100 
      }, 1000); 
      return false; 
      } 
     } 
     }); 
    });