Свиток движется слишком далеко

Question

Проверьте эту скрипку.

Предположим, что первый видимый элемент внутри контейнера прокрутки #1 элемент. В приведенной выше скрипке я вижу #1, #2, #3 а также #4 элементы. и если я прав, если прокрутить один раз, я смогу увидеть следующие 4 элемента, т.е. #5, #6, #7 а также #8, Но когда я прокручиваю один раз колесо мыши, контейнер прокрутки перемещается в #15 элемент.

Пожалуйста помоги.

// update content every second
function addChild() {
    var el = $('<div></div>').html('#' + $('#testDiv').children().length)
        .css({
        padding: '3px',
        border: '1px solid #ccc',
        margin: '5px'
    });
    $('#testDiv').append(el);

    // update slimscroll every time content changes
    $('#testDiv').slimscroll();
}

$('#testDiv').slimscroll({
    alwaysVisible: true,
    height: 150
});

for (var i = 0; i < 300; i++) {
    addChild();
}

PS: я заполнил вопрос на github

Answer 1

Проверь это:

// update content every second
function addChild() {
    var el = $('<div></div>').html('#' + $('#testDiv').children().length)
        .css({
        padding: '3px',
        border: '1px solid #ccc',
        margin: '5px'
    });
    $('#testDiv').append(el);

    // update slimscroll every time content changes
    $('#testDiv').slimscroll();
}


for (var i = 0; i < 300; i++) {
    addChild();
}

$('#testDiv').slimscroll({
    alwaysVisible: true,
    height: 150
});

JSFiddle

Я только что загрузил div перед slimscroll