Estou querendo que uma determinada div
, que possua o atributo overflow-y:auto
, cuja altura é fixa, seja rolada ao final, assim que um elemento é acrescentado nela.
Nesse caso, preciso que ela role até o final, pelo fato de sua altura ser fixa, porém não é fixa a quantidade de elementos dentro dela. Ou seja, assim que um elemento é adicionado com um append
, preciso que o scroll
role até o final dessa div
.
Atualmente, consigo fazer isso facilmente com a função scrollTop
, porém acho que definir o valor como 9999999
seja muita gambiarra muito deselegante.
Veja algo aproximado do que tenho:
$(function()
{
$('#div').animate({scrollTop: 9999999}, 500);
});
#div{
height:150px;
background: tomato;
overflow-y: auto;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id='div'>
<li>Conteúdo</li>
<li>Conteúdo</li>
<li>Conteúdo</li>
<li>Conteúdo</li>
<li>Conteúdo</li>
<li>Conteúdo</li>
<li>Conteúdo</li>
<li>Conteúdo</li>
<li>Conteúdo</li>
<li>Conteúdo</li>
<li>Conteúdo</li>
<li>Conteúdo</li>
</div>
Como faço para rolar essa
div
até o final, sem ter que utilizar o método atual descrito acima?Como saber o tamanho do
scroll
dessa div?