Динамически увеличивая высоту - ScrollSpy

Question

Я реализовал Scrollspy в своем приложении. Так как я использую в своем приложении структуру нокаута, пользователь может добавить до 15 строк в секцию. Поэтому, если они добавляют 15 строк, это влияет на высоту шпиона прокрутки. Как я могу сделать это динамически.

Код:

$(window).scroll(function () {
    var myArray = new Array();
    var curArray = '';
    $('div.spyClass').each(function () {
        myArray.push($(this).offset().top);
    });
    for (var i = 0; i <= myArray.length; i++) {
        if ($(this).scrollTop() >= myArray[i]) {
//When i add new rows the height of this wil become (say 520+).Then automatically the second link is getting the active .Eventhought it is not active.
                if ($(this).scrollTop() >= -20 && $(this).scrollTop() <= 101) {
                }
                else if ($(this).scrollTop() >= 101 && $(this).scrollTop() <= 520) {
                }
                else if ($(this).scrollTop() >= 520 && $(this).scrollTop() <= 840) {
                }
                else if ($(this).scrollTop() >= 830 && $(this).scrollTop() <= 1300) {
                }
                else if ($(this).scrollTop() >= 1300 && $(this).scrollTop() <= 1600) {
                }
            }
        }
    });

Пожалуйста, дайте мне решение, чтобы сделать его динамичным.

Answer 1

Вот как я этого добиваюсь.

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

$(window).scroll(function () {

    var firstCont= ($('#Content1').height() + 20); -- Since i have fixed position header 20 is needed
    var secondCont = envEnd + ($('#Content2').height() + 20);
    var thirdCon = serEnd + ($('#Content3').height() + 20);


    var myArray = new Array();
    var curArray = '';
    $('div.spyClass').each(function () {
        myArray.push($(this).offset().top);
    });
    for (var i = 0; i <= myArray.length; i++) {
        if ($(this).scrollTop() >= myArray[i]) {
                   if ($(this).scrollTop() >= -20 && $(this).scrollTop() <= firstCont) {
                }
                else if ($(this).scrollTop() >= firstCont && $(this).scrollTop() <= secondCont) {
                }
                else if ($(this).scrollTop() >= secondCont && $(this).scrollTop() <= thirdCont) {
                }
            }
        }
    });