2011-08-12 6 views
1

그래서 다음 스크립트를 사용하여 명명 된 앵커를 부드럽게 스크롤하지만 대상이 페이지의 앵커 위에있을 때 (위쪽으로 스크롤되지 않음) 작동하지 않습니다.Jquery scroll anchor up

$(document).ready(function(){ 
     $('a[href^="#"]:not(.top)').click(function(event){ 
     event.preventDefault(); 
    var full_url = this.href; 
     var parts = full_url.split("#"); 
     var trgt = parts[1]; 
     var target_offset = $("#"+trgt).offset(); 
     var target_top = target_offset.top; 
     $('html, body').animate({scrollTop:target_top}, 500); 
    }); 
}); 

친숙한 방법을 아는 사람이 있습니까?

편집 :

나는 현재이 위쪽으로 지금 스크롤 사용하지만 하나의 함수에서 할 수있는 청소기 방법을 알고있는 경우 멀리 게시하시기 바랍니다 오전 :

그것은 나를 위해 작동
$('.top').click(function(event){ 
    event.preventDefault(); 
    $('html, body').animate({scrollTop:0}, 500); 
}); 

답변

3

, 명명 된 앵커 대신 요소 ID를 사용합니다.

어쨌든 명명 된 앵커 대신 ID를 사용해야합니다. HTML5에서는 명명 된 앵커가 사용되지 않습니다.

<a name="section1"><h1>Section One</h1></a> 

should be: 

<h1 id="section1">Section One</h1> 

그리고 당신은 하나의 함수에서 스크롤을 결합 할 수 있습니다 : 즉

$('a[href^="#"]').live('click',function(event){ 
    event.preventDefault(); 
    var target_offset = $(this.hash).offset() ? $(this.hash).offset().top : 0; 
    $('html, body').animate({scrollTop:target_offset}, 500); 
}); 
+1

덕분에 그들이 사용되지 않는 실현 didnt가 또는 해시 앵커 ID를 에테르로 갈 수있다. –

+1

스크립트를 업데이트했습니다. 이제 .top 클래스를 제거 할 수 있어야합니다. –

+0

감사합니다. 다시 작동합니다. –