滚动移动太远

Question

检查此fiddle。

假设滚动容器内的第一个可见元素是#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

我刚刚加载了slimscroll之前的div