javascript - mCustomScrollbar 预先添加新内容

Question

我正在使用 mCustomScrollbar，并且我正在尝试动态加载滚动条顶部和底部的内容(当然，不是同时加载)。

http://manos.malihu.gr/jquery-custom-content-scroller/

当附加内容时，效果非常棒，滚动将保持在正确的位置(您滚动到的位置，并且会自动更改滚动条位置，以便您可以继续向下滚动以查看新内容)。

但是，当您添加内容(将其放在滚动条的顶部)并且用户向上滚动时，内容将加载，但滚动条将被迫向上移动到顶部。我希望它的工作方式与在底部附加内容时完全相同:让用户向上滚动以查看新内容。

$(selector).mCustomScrollbar({
    mouseWheel: { 
        scrollAmount: 500,
        preventDefault: true
    },
    callbacks: {
        advanced: {
            updateOnContentResize: true
        },
        onScroll: function() { 
            // this.mcs.topPct contains the current scroll position (when scroll animation is completed.
            // it can be between 0-100, where 100 is bottom and 0 is top
            //
            // my scroll starts on the bottom, and when this.mcs.topPct is 0
            // I load dynamic content and place it on the very top of all content
            // this causes the scroll to display this content immediately,
            // and I would like the user to manually scroll up to see the added content.
        }
    }
});

Answer 1

如果它仍然相关，我的解决方案是:

1. 在加载新数据之前(假设您使用 jquery load/post)，将您的第一个最上面的条目(评论、图片等)作为对象“YourObject”(按照您喜欢的方式命名)

2. 加载新内容后，请使用以下行

   $(selector).mCustomScrollbar("scrollTo",YourObject,{scrollInertia:0});

它有点闪烁，但目前这是实现它的唯一方法。