關於single page website scrolling 問題

shing1630

用咩front-end  framework ?

justlazy

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

複製代碼

你個 click event fire 時，個`$($anchor.attr('href')).offset().top`計法係包括咗個 header (menu) height。但當個 header 變咗 sticky 時用咗`position: fixed`，個 height 就唔計响 body 入面。

解決方法之一：header 幾時都用`position: fixed`，`section#about`個`margin-top` set 做 header height。