指定された要素が一番上になるようにページを下にスクロールできますか？

Question

私はバックコントローラのメソッドからHTMLデータを取得し、アップするまで、その後、空要素に追加し、このjQueryのを持っている：

$("#btnViewList").click(function() { 
    $.ajax({ 
     type: "GET", 
     url: '@Url.Action("GeneratePDFOfReportFutures", "GenerateScheduledRptsPDF")', 
     success: function (retval) { 
      $("#tableshell").append($(retval)); 
      $("html, body").animate({ scrollTop: $(document).height() }, 1000); 
     }, 
     error: function() { 
      alert('error in btnViewList'); 
     } 
    }); 
}); 

膨張する要素が単純である：」

<div id="tableshell"> 
</div> 

このデータが追加された後、ページを下にスクロールして、ユーザーが手動でページを下にスクロールしなくても、動的に追加されたhtmlが表示されるようにします。私はコードjQuery Scroll To bottom of the pageをの下のに移動すると見つけました。それはうまくいきましたが、スクロール後に表示されている領域の上部に新しく追加されたhtmlの最初の部分が表示されます。

これはどのように達成されましたか？

Answer 1

あなたは

$('html, body').animate({ 
    scrollTop: $("#tableshell").offset().top 
}, 1000); 

PLSのはこれがあなた

Answer 2

それは "昔ながらの" Javascriptを使用して、パイのように簡単です：何らかの理由で、jQueryifiedバージョンについては

document.getElementById("tableshell").scrollIntoView(); 

：

$("#tableshell").scrollIntoView(); 

...動作しません。

だから私のjQueryのは今です：

$("#btnViewList").click(function() { 
    $.ajax({ 
     type: "GET", 
     url: '@Url.Action("GeneratePDFOfReportFutures", "GenerateScheduledRptsPDF")', 
     success: function (retval) { 
      $("#tableshell").append($(retval)); 
      document.getElementById("tableshell").scrollIntoView(); 
     }, 
     error: function() { 
      alert('great oogly moogly - Zappa missed Mother's day!'); 
     } 
    }); 
});