Question

我在我的网站上安装了jScrollPane，无法使其正常工作。

我的网站工作原理如下：从主页面，使用jQuery的load()方法动态加载页面。在我加载的页面中，我有以下脚本来启动jScrollPane：

$(function(){
    $('.scroll-pane').jScrollPane();
});

这似乎被称为。到目前为止我没有问题。问题是页面在开始时不够长，不需要滚动条。我隐藏的内容仅显示在特定操作上（即单击按钮显示某个段落的内容），当我单击以显示隐藏div的内容时，滚动条不会出现。

我还试图在显示新内容时调用$('.scroll-pane').jScrollPane();（例如，如果在隐藏的.show()上触发div，我也会调用$('.scroll-pane').jScrollPane();）但我也没有成功。

任何人都可以帮助我吗？

由于

编辑：

我忘了提到页面的结构：我有div有class="scroll-pane"并加载了页面加载，它包含点击特定区域时显示的小隐藏div。我想用类滚动窗格向div添加一个滚动条，以使显示的div的内容可滚动（现在内容保持在div的大小但是它不可滚动，因为没有jScrollPane滚动条是示出）。

更新

我尝试将$('.scroll-pane').jScrollPane();放入我的div的.show()方法的回调中，并尝试将class="scroll-pane"放到显示的那些div中，但同样没有显示任何内容（滚动条）没有出现，div不可滚动。）

Answer 1

检查插件开发者提供的此演示

http://jscrollpane.kelvinluck.com/examples/invisibles.html

首次显示元素时，您只需（重新）初始化 scrollpane（如果你愿意，你甚至可以使用autoReinitialise）和它的宽度和高度将被正确计算。

您需要的只是

$(function(){
    $('.scroll-pane').jScrollPane({autoReinitialise: true});
});

可能是插件的最新版本

Answer 2

我建议使用css visibility属性而不是自动重新初始化。每次调用show（）方法时，jScrollPane都会重新初始化。这需要时间并对动画产生影响。

如果你使用幻灯片...（）方法，那么动画会正常启动，但可滚动容器（及其元素）稍后出现，看起来很糟糕。

var wrapper = jQuery('#gallery-album-preview-wrapper');
if (wrapper.css("visibility") == "hidden") {
    wrapper.css("visibility", "visible").css("display", "none");
}
if (wrapper.is(":hidden")) {
    wrapper.slideDown(1000);
} else {
    wrapper.slideUp(1000);
}

JScrollPane无法正常使用隐藏内容

2 个答案: