jQuery的scrollTop动画不像预期的那样工作

Question

我正在使用scrollTo事件来将作为最后一个元素添加到“ul”元素中的元素进行聚焦。

问题是，它正常工作达20个元素，后来滚动移动“反向”，甚至没有适当地聚焦最后添加的元素。

任何一个帮我排序这.. ..？

这里是smapel代码：

var text = 0; 

$('button').on("click", function() { 

     text +=1; 

    var list = $("<li />", { text : "list : " + text}); 
    $("ul").append(list); 

    $("#container").stop().clearQueue().finish().animate({ 
     scrollTop : $(list).offset().top 
    }, 2000) 

}) 

Live Demo

在此先感谢。

Answer 1

诀窍是动画#containerscrollTop财产：
scrollHeight-height：

LIVE DEMO

var text = 0, 
    $cont = $('#container'), 
    contH = $cont.outerHeight(); 

$('button').on("click", function() { 

    var $li = $("<li />", { text: "list : "+ (++text)}); 
    $("ul").append($li); 
    var contSH = $cont[0].scrollHeight; 

    $cont.stop().animate({ 
     scrollTop : contSH - contH 
    }, 400); 

});