jQuery меняет высоту при добавлении контента

Question

У меня есть функция jQuery, которая получает высоту моего document и прикрепляет div к виду.

Работает нормально, когда содержимое уже здесь, когда загружен DOM, но если я добавлю li в свой контейнер, я бы хотел обновить эту функцию, чтобы получить новую высоту документа

Вот код js:

$(function()
{
    var documentHeight = 0;
    var topPadding = 55;

    var offset = $("#sidebar").offset();
    documentHeight = $(document).height();
    $(window).scroll(function() {
        var sideBarHeight = $("#sidebar").height();
        if ($(window).scrollTop() > offset.top)
        {
            var newPosition = ($(window).scrollTop() - offset.top) + topPadding;
            var maxPosition = documentHeight - (sideBarHeight + 100);
            if (newPosition > maxPosition)
            {
                newPosition = maxPosition;
            }
            $("#sidebar").stop().animate({
                marginTop: newPosition
            });
        }
        else
        {
            $("#sidebar").stop().animate({
                marginTop: 0
            });
        };
    });
});

И структура HTML:

<div id="single_content">
    <ul>
        <li>...</li>
        <li>...</li>
        <li>...</li>
        ...
    <ul>
</div>

Я думаю, что мне нужно что-то с on.change> обновить высоту документа для использования в моей функции?

Спасибо за помощь!

решено:

Я нашел решение, поместив это: $(document).height(); внутри $(window).scroll(function() {});

Спасибо за ответы!

Answer 1

$(window).scroll(function() {
    documentHeight = $(document).height(); // put this line inside scroll
    // the rest of code
});