Jquery scroll to element

Question

私は、Ajaxを使ってページコンテンツを更新するJQueryをいくつか持っています（いくつかのサブテーブルコンテンツをページングしています）。コンテンツが更新されたばかりのセクション。私が試してみて、スクロールを実行するためにいくつかのコードが見つかりましたが、それは今まで右ページの先頭に戻るなく特定の要素へ行く：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".page-number").on("click", function() { 
      var page = parseInt($(this).html()); 
      $.ajax({ 
       url: '@Url.Action("ProductReview")', 
       dataType: 'html', 
       data: { 
        "id": @Model.Product.ProductID, 
        "page": page 
       }, 
       success: function (data) { 
        $("#review-list").html(data); 
        $("#page-number-"+ page).addClass("selected"); 
        //location.hash = "#prodreviews"; 
        scrollToAnchor("prodreviews"); 
       } 
      }); 
     }); 
     // scroll handler 
     var scrollToAnchor = function(id) { 
      // grab the element to scroll to based on the name 
      var elem = $("a[name='"+ id +"']"); 
      // if that didn't work, look for an element with our ID 
      if (typeof(elem.offset()) === "undefined") { 
       elem = $("#"+id); 
      } 
      //alert(elem.offset().top); 
      // if the destination element exists 
      if (typeof(elem.offset()) !== "undefined") { 
       // do the scroll 
       $('html, body').animate({ 
        scrollTop: elem.offset().top 
       }, 1000); 
      } 
     }; 
    }); 
</script> 

これは自分自身を再ロードAsp.net MVC部分ビュー内にありますページングリンクがクリックされたときに、主要なかみそりのビューに表示されます。

<a name="prodreviews" id="prodreviews"></a> 

と同じ部分ビュー内の私のページングのリンクは以下のとおりです：

<div class="pagewrapper"> 
@for (int i = 1; i <= Model.Reviews.NumberOfPages; i++) 
{ 
    <a class="page-number" id="page-number-@i" href="javascript:void(0)">@i</a> 
} 
</div> 

はアンカーが再び時にAjaxの火災をレンダリングされるので、それです、私はこの部分図の上部近くに、次のアンカーを持っていますか？私はそれをメインのかみそりのビューに移動しようとしましたが、jQueryのコードはまったく見つかりませんでした（DOMにあるはずですが）。

アンカーが戻ったとき部分的な視点で、アラートが解除されていないときに要素を見つけて負の数字を返します。これは現在の場所からのオフセットであるためです。ページは、それから私が望むところに戻るのではなく、その絶対点にスクロールしようとしていますか？

Answer 1

DEMO - .animate()が問題ありません。

#prodreviews要素がページ上に存在することを確認し、ページ上で視覚的に識別できるようにCSSスタイルを指定します。また、ページに#prodreviewsタグの上にfloating elementsが含まれている場合は、それがclearであることを確認してください。

ウェブブラウザでDeveloper Toolsを開き、コンソールに他のJavaScriptエラーがないかチェックしてください。これにより、この特定のコードが実行されない可能性があります。