섹션으로 스크롤

Question

jQuery 및 부트 스트랩 사용 3 한 페이지 스크롤링 웹 사이트를 만들려고합니다. 여기에 Working Demo입니다. 지금까지 사용자 Section 1에서 Section 3에 Section 2 또는 Section 2 같은 순서로 스크롤하지만 nav navbar-nav 항목 에 약간의 문제가있을 때 잘 보이는 경우 Section 1에서 Section 6에 같은 순서 중 사용자가 스크롤. Section 7 스크롤에 대한 하나의 중요한 문제도 있습니다

(당신이 다음 이미지에서 볼 수 있듯이) 그것은! 대상 항목을 얻을 수있는 각 항목에 대한 nav navbar-nav 단계처럼 보인다. 다른 섹션과 동일한 위치로 스크롤하지 않으며 더 많은 공간이 있습니다. 여기

내가

<script> 
    $(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 
      }, 1000); 
      return false; 
      } 
     } 
     }); 
    }); 
    </script> 

당신이 코드에서 이러한 일을 해결하는 데 도움 주실 래요 스크롤에 사용되는 JQuery와이다 (당신은 다음 이미지에서 볼 수 있듯이)? 감사합니다

Answer 1

1) 문제는 마지막 부분에서 해결하기 쉽습니다. 마지막 섹션 아래에 충분한 "공간"이 없으므로 브라우저는 더 이상 스크롤 할 수 없습니다. 더 빠르고 더러운 수정은 마지막 문단의 끝에 어떤 부분을 삽입하는 것입니다.

<p>&nbsp;</p> 

줄을 마지막 단락의 끝에 삽입하십시오.

2) 나는 이것이 까다로울 수 있다고 생각합니다. 문제는 섹션이 아니라 "html"및 "body"요소가 스크롤된다는 것입니다. 즉, 사용자가 첫 번째 섹션에 있고 마지막 섹션을 클릭하면 전체 페이지가 스크롤됩니다. 사용자는 스크롤 애니메이션 중에 모든 내용을 봅니다. 내 생각에 이것이 어떻게 작동 할 것으로 생각됩니다. 그렇지 않으면 실제로 스크롤하는 방법과 방법을 변경해야합니다.