jQuery scrollTop - 애니메이션이 작동하지 않습니다.

Question

예제를 사용하여 here을 찾았습니다. 동일한 것을 구현하려고합니다. 탐색 링크를 클릭하면 슬라이딩/스크롤 대신 선택된 div로 이동합니다.

HTML :

탐색

<div class="span3"> 
     <a href="#about-me"><img class="img-circle" src="http://placehold.it/200x200/e36b23/fff/&text=About+Me+"></a> 
</div> 

DIV

<div class="row-fluid" id="about-me"> ... </div> 

JS :

<script> 
$(document).ready(function(){ 

    $('nav ul li a').click(function(){ 
     var el = $(this).attr('href'); 
     var elWrapped = $(el); 

     scrollToDiv(elWrapped,40); 

     return false; 
    }); 

    function scrollToDiv(element, navheight){ 
     var offset = element.offset(); 
     var offsetTop = offset.top; 
     var totalScroll = offsetTop - navheight; 

     $('body,html').animate({ 
      scrollTop: totalScroll 
     }, 1000); 
    } 
}); 
</script> 

,536,

그래서 '클릭 한'div가 표시되지만 슬라이드 애니메이션이 아닌 - 원하는대로 표시됩니다. 누구든지 아이디어가 있습니까?

Answer 1

- 당신은, 예를 들어, 당신의 인용 예를 사용하는 것과 동일한 ul/li를 사용하지 않는

$('.span3 a').click(function(){ 

는 바이올린을위한 here를 참조하십시오 : 귀하의 링크가 유효한 앵커가

Answer 2

앵커 지점으로 바로 이동 ("점프")하는 기본 동작을 방지하지 않습니다. 그래서 여기 간다 : 당신은 당신의 HTML 클래스를 일치하도록 jQuery를 선택을 조정해야

$('nav ul li a').click(function(evt){ 
    evt.preventDefault(); 
    ... 
});