jquery - PopEasy模态窗口中的JScrollPane(自定义滚动条)

第一次发布:-)我到处都在寻找答案，但似乎找不到。我不是jQuery专家，但是可以解决我的问题。

PopEasy：http://thomasgrauer.com/popeasy
JScrollPane：http://jscrollpane.kelvinluck.com/index.html

我试图让JSscrollPane在PopEasy模态窗口内工作。术语可能已关闭，但我认为我需要在模态加载后对其进行初始化吗？

这是PopEasy模态的代码：基本上，您单击一个链接，模态将显示：

$('.modalLink').modal({
    trigger: '.modalLink',
    olay:'div.overlay',
    modals:'div.modal',
    animationEffect: 'fadeIn',
    animationSpeed: 300,
    moveModalSpeed: 'slow',
    openOnLoad: false,
    docClose: true,
    closeByEscape: false,
    moveOnScroll: false,
    resizeWindow: true,
    close:'.close-button'
});

通常，JScrollpane只是：

$('.scroll-pane').jScrollPane();

我假设（并希望）答案很简单，并且缺少一些小东西，但是我尝试了一些我还不完全了解的事情，例如：

jQuery(document).on('click','.modalLink',function($){
    $('.right-side').jScrollPane({});
});

我需要帮助 ：-（

谢谢你们！

最佳答案

由于jScrollPane是在初始化时计算容器的，因此您希望在加载模式后执行init / reinit，因为PopEasy在加载模式后没有API进行回调，所以这有点棘手。

一种简单但较差的方法是添加一个超时，如下所示：

jQuery(document).on('click','.modalLink',function($){
    setTimeout(function(){
        $('.right-side').jScrollPane({});
    }, 500);
});

替代方法是在动画完成后向popeasy添加回调功能以运行回调。
如果您需要重新初始化，则需要像下面这样访问jScrollPane API：

$(function() {
    var pane = $('.right-side');
    pane.jScrollPane({});
    var api = pane.data('jsp');

    jQuery(document).on('click','.modalLink',function($){
        setTimeout(function(){
            api.reinitialise();
        }, 500);
    });
});