Как прокручивать в div функцию jQuery aimate()?

У меня есть этот фрагмент кода, который прокручивает все тело до определенного места →

$('html, body').animate({ scrollTop: 1000}, 800, 'swing');

Но что, если я хочу прокрутить до определенного места в div, как this →

$('#div-id').animate({ scrollTop: 1000}, 800, 'swing');

Я пробовал этот путь, но он не работает, можете ли вы сказать мне, где я ошибаюсь?

ПРИМЕЧАНИЕ. Элемент #div-id имеет переполнение: auto как одно из его правил css.

Ответ 1

Попробуйте эту демонстрацию:

$('#div').scroll();
$("#div").animate({
  scrollTop: 1000
}, 2000);

#div {
  height: 100px;
  overflow: scroll;
  width: 200px;
  border: 2px solid red;
}

<!DOCTYPE html>
<html>

<body>
  <div id='div'>
    dads dads dads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dads dads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dads dads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dads dads dadsdads dadsdads dadsdads dadsdads dadsdads
    dadsdads dads dads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dads dads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dads dads dadsdads dadsdads dadsdads dadsdads dadsdads
    dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dadsdads dads
  </div>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
</body>

</html>

Ответ 2

Как пробовать вот так: -

function scrollingdiv(parentid, id){
    $("#"+parentid).animate({scrollTop: $("#"+id).position().top}, 800, 'swing');
}