アンカーリンクをスクロールしてスムーズにバックアップする方法はありますか？

Question

下のアンカーに行ったときと同じように、スムーズにトップアンカーにスクロールするようにページを取得しようとしています。しかしスムーズにスクロールするのではなく、アニメーションなしでジャンプします。

スムーズに両方向にスクロールできるようにするために私ができることを指摘してくれる人がいますか？

はJavaScript

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

JSFiddle

Answer 1

<a href="#myAnchor" name="topAnchor" id="anchor1">のIDが間違っているが、id="topAnchor"に設定し、それがうまく動作します。

Answer 2

トップアンカーを名前ではなくIDでターゲティングすると、スムーズにスクロールします。 （これはanchor1のIDを持っていた。）更新フィドルを参照してください：私はjQueryを使ってこれを行っている

<a name="topAnchor" href="#myAnchor" rel="" id="topAnchor" class="anchorLink">Link to the anchor</a> 

Answer 3

：

http://jsfiddle.net/freginold/atg8xcyd/1/

これはトップアンカー要素の更新されたHTMLコードです。機能として、それは再利用可能である：任意のHTML要素で

function goTo(goToElement) { 
     $('body').animate({scrollTop:$(goToElement).offset().top}, 1500); 
} 

はただのonclick =「GOTO（ 『＃のid_to_goTo』）」を設定し、それはあなたがいずれかの上または下に渡された要素のIDにスクロールを滑らかにします。