2012-10-19 4 views
7

나는 스틱 내비게이션과 부드러운 스크롤과 관련하여 여러 가지 문제를 겪고있다. 문제를 해결하기 위해 jQuery에 대해 충분히 알지 못합니다. Chris Coyer의 부드러운 스크롤 스 니펫을 사용하고 있습니다 : http://css-tricks.com/snippets/jquery/smooth-scrolling/. 내 페이지는 여기에 있습니다 : http://clients.ekcetera.com/agivingchance. 그 다음, 부분적으로 스크롤 위치로 점프의 탐색 항목 중 하나를 들어부드러운 스크롤링으로 스티키 내비게이션이 점프하고있다

  1. : 여기

    내 문제입니다. 저는 끈적한 헤더를 어떻게 설명 할 지 모르기 때문에 확신합니다. 그래서 앵커의 높이를 설명하기 위해 앵커를 약간 올려 놓았습니다. 그래서 앵커에 도달하여 멈추지 만 올바른 시각으로 점프합니다.
  2. 뒤로 버튼을 클릭하면 항상 올바른 위치로 이동하지 못하는 것처럼 보입니다. 때로는 꽤 무작위입니다. 나는 이것이 문제 1과 관련이 있다고 생각하고 희망적으로 스스로 해결할 것이다. 심지어 브라우저 기록/뒤로 버튼 일을 모두 제거해도 좋겠지 만, 내가 말했듯이, JQuery 마스터는 무엇을 제거해야하는지 알기에 충분하지 않습니다.

의견이 있으십니까?

미리 감사드립니다.

답변

1

1.를 사용하여 부드러운 스크롤 포스트에 대한 Devin Sturgeon의 코멘트에서이 코드. 또한 끈적한 헤더 을 보완하기 위해 약간의 뺄셈을 추가했습니다. 좋아하는 것을 조정하십시오. 당신이 이동하고자하는 실제 요소에

// your functions go here 
$('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 - 181 
      }, 1000); 
      return false; 
     } 
    } 
}); 

2 이동 모든 앵커.

(참조 : http://css-tricks.com/snippets/jquery/smooth-scrolling/#comment-197181)

+0

감사합니다! 완벽하게 일했습니다. – kgarrett