페이지에서 앵커로 애니메이션 움직이기

Question

나는 stackoverflow에서 다른 사용자의 솔루션을 여러 번 시도했지만 아무 것도 얻을 수 없었습니다. 누구나 this page에있는 앵커로 스크롤하는 방법을 보여줄 수 있습니까? 어떤 도움을 greaty 감사하게 될 것입니다!

(죄송합니다. 웹 사이트 용 코드를 작성하는 데 익숙하지 않습니다. 예, weebly를 사용하고 있습니다 만 끔찍할 수 있습니다. 자바 스크립트 파일을 업로드하고 CSS 및 HTML을 통해 링크 할 수 있습니다.)

Answer 1

나는 또한, 내가 사용하는 가장 좋은 튜토리얼 http://www.learningjquery.com/2007/10/improved-animated-scrolling-script-for-same-page-links 이

<a id="work></a> 

그런 다음 해시 태그로 링크 앵커 링크는 태그 내에 있는지 확인했다이에 문제가 있었다

<a href="#work"></a> 

Answer 2

그게 어떨까요? jsfiddle?

특정 ID로 스크롤됩니다. 당신이 애니메이션/부드러운 스크롤을 확인하려면

function scrollToAnchor(aid){ 
    var aTag = $("a[name='"+ aid +"']"); 
    $('html,body').animate({scrollTop: aTag.offset().top},'slow'); 
} 

$("#link").click(function() { 
    scrollToAnchor('id3'); 
}); 

Answer 3

당신은 사용할 수 있습니다

var anchor = $('a[name=Photoshop]').offset().top 
$(document.body).animate({ 
     scrollTop: var 
    }, 2000); 

당신이 그냥 빨리 당신이 var anchor = $('a[name=Photoshop]').offset().top 그리고 $(document.body).scrollTop(anchor)

Answer 4

이 시도를 사용할 수 있습니다 이동합니다 :

function ScrollTo() { 
    $('a').click(function(){ 
    $('html, body').animate({ 
     scrollTop: $($.attr(this, 'href')).offset().top 
    }, 500); 
    return false; 
}); 
} 

다음 형식으로 링크를 구성하십시오. ws :

<a href="#aboutUs" onClick="ScrollTo()">About Us</a> 

Answer 5

나는 나를 위해 잘 작동하는 함수가 있는데, 자동으로 앵커 태그가 클릭 된 애니메이션을 움직입니다.

$("a").click(function(event){ 
    if(event.target.href.indexOf("#")!=-1){ 
     var arrhash=event.target.href.split("#"); 
     $('html, body').animate(
      { scrollTop: $('a[name=' + arrhash[1] + ']').offset().top }, 
      500, // this is the animation time 
      function(){ return false; } // what to do after the animation 
     ); 
    } 
}); 

언제든지 어딘가로 이동 - 애니메이션됩니다. 또한 자바 스크립트가 작동하지 않으면 표준 점프로 정상적으로 돌아갑니다.

Abhishek Umrao의 코드가 정상적으로 작동하지 못해 대신 생각에 기반 해 작동합니다.