jScrollpane 多次触发后行为不当

Question

我在我的网站中使用 jscrollpane http://jscrollpane.kelvinluck.com/ 并且它可以工作，但不能100%。

需要明确的是，我在图像列表上使用 jscrollpane 来满足水平溢出的需要。图像位于 div 内，一旦用户单击不同的按钮，我将更改 div 内容。因此，我需要将维护位置设置为 false，以确保 div 内容更改后，它不会向右“过度滚动”并使左侧的内容不可见。

这是我的代码：

// function to change the div content
function getContainerImg(cid) {

// Use jscrollpane api function to enable reinitialization
    var scrollelement = $('#containersimg').jScrollPane({ maintainPosition: false });
    var api = scrollelement.data('jsp');
    $.ajax({
        async: false,
        url: '@(Url.Action("GetContainersImg", "Kitchen"))',
        type: 'GET',
        data: { name: cid },
        success: function (result) {

            api.getContentPane().html(result);
            // Needed to apply jscrollpane after change new container type
            api.reinitialise();

            $('#containersimg').effect('slide', 500);

我在测试过程中测试了几个场景，出现了一些奇怪的行为：

1. 如果我打开我的网站并让它闲置一段时间，则维护位置无法工作，使更新的图像不可见
2. 如果我单击多次切换内容的按钮，滚动条会消失一段时间，只有再次触发内容更改才会重新出现

编辑： 附上一张图片来说明我的情况：

编辑 2： 在此处包含完整代码：

pastebin.com/qfVSp2tq Css：

pastebin.com/FdMXhS5B

滚动条丢失的情况越来越频繁......

知道为什么会出现这个问题吗？这是一个非常重要的错误，因为如果滚动条保留在最右边的位置或者滚动条根本不出现，用户可能无法看到内容。

我想可能的原因可能是我构造滚动条的顺序。有什么建议吗？ 非常感谢...

Answer 1

我有一个困惑，也许它可以帮助你，看看当你点击图像向下滑动 500 时，但是在 ajax 请求上是否收到任何内容？，可能空内容会覆盖你最后 3 张图像，因为收到空内容你什么也看不到，我不确定，但可能是..