Настройка высоты div + прокрутка вниз

Question

Я пытаюсь получить страницу, чтобы прокручивать донизу автоматически - самая простая вещь в мире, не так ли? Ну не так много. У нас есть SPA (с использованием Kendo UI) для очень простого дискуссионного форума. Часть JS для этой страницы включает настройку высоты нашего содержимого div, который, как я обнаружил, препятствует работе стандартной функции scrollTop.

Вот страница:

Заголовок статичен, а нижний колонтитул является липким в нижней части страницы. Вы заметите, что полоса прокрутки не отстает от секции добавления комментариев, которая является частью причины, по которой мы устанавливаем высоту.

Установка высоты:

$('.content-area').height($(window).height() - ($('header nav').height() + $('.disc-add-comment-cont').height())); 

.content-зона все на странице, за исключением заголовка и нав. header nav - это статический заголовок, а .disc-add-comment-cont - нижний колонтитул комментария.

код я использую для нижней прокрутки примерно так же ваниль, как это происходит:

$("html, body").animate({ scrollTop: $(document).height() }, "slow"); 

Я также попытался:

$("html, body").animate({ scrollTop: $(window).height() - ($('header nav').height() + $('.disc-add-comment-cont').height()) }, "slow"); 

для учета первой высоты известково, но не повезло.

Мне нужна прокрутка до нижней функциональности, чтобы работать, даже при нашем существующем расчете высоты. У меня было бы довольно трудное сообщение для примера, но я на 100% уверен, что это наш расчет высоты. Оставьте это в коде, прокрутка не работает. Прокомментируйте это, прокрутка работает, как ожидалось.

Answer 1

Свиток, что вы есть на .content-area элемент, а не на htmlbody или, так что вы должны листать этот элемент:

$(".content-area").animate({scrollTop: $('.content-area').prop("scrollHeight")}, "slow");