JScrollPane не работает должным образом со скрытым контентом

Я установил jScrollPane на своем веб-сайте и не могу заставить его работать.

мой сайт работает следующим образом: с главной страницы, страницы загружаются динамически с помощью jQuery это load() метод. На странице, которую я загружаю, у меня есть следующий скрипт для запуска jScrollPane:

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

который, кажется, называется. Пока никаких проблем. Проблема в том, что страница в начале недостаточно длинная, чтобы нуждаться в полосе прокрутки. У меня есть скрытый контент, который отображается только на конкретном действия (т. е. нажатие на кнопку показывает содержимое определенного абзаца), и когда я нажимаю, чтобы показать содержимое скрытого div, полоса прокрутки не появляется.

Я также пытался позвонить $('.scroll-pane').jScrollPane(); Как я показываю новый контент (т. е. в случае, если триггеры .show() на скрытый div Я $('.scroll-pane').jScrollPane();), но у меня тоже не было успеха.

кто-нибудь может мне помочь?

спасибо

EDIT:

Я забыл упомянуть структура страницы: у меня div имеющего class="scroll-pane" и загружается с загрузкой страницы и содержит небольшие скрытые divs, которые появляются при нажатии на определенные области. Я хотел бы добавить полосу прокрутки в div с областью прокрутки класса, чтобы сделать содержимое показанного div прокручиваемым (прямо сейчас содержимое остается в размере div, но оно не прокручивается, так как не отображается полоса прокрутки jScrollPane).

обновление:

Я пытался поставить $('.scroll-pane').jScrollPane(); in обратный вызов .show() метод моих дивов и попытался поставить class="scroll-pane" для тех divs, которые появляются, но снова ничего не отображается (полоса прокрутки не отображается, и div не прокручивается).

6
javascript jquery-jscrollpane jscrollpane

2 ответов

проверьте эту демонстрацию, предоставленную разработчиком плагина

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

когда элемент впервые показан, вам просто нужно (re)инициализировать scrollpane (или вы даже можете использовать autoReinitialise, если хотите) и его ширина и высота будут рассчитаны правильно.

все, что вам нужно-это

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

и может быть последней версией плагина

19

Я предлагаю использовать CSS свойство видимость авто reinitialising. Каждый раз при вызове метода Show (), jscrollpane не reinitialises себя. Это требует времени и влияет на анимацию.

Если вы используете, скажем, слайд..() методы, затем анимация запускается правильно, но прокручиваемый контейнер (и его элементы) появляется немного позже, и это выглядит плохо.

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);
}
1