JScrollPane не работает должным образом со скрытым контентом - PullRequest
Новая
       19

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

6 голосов
/ 28 января 2012

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

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

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

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

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

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

Спасибо

РЕДАКТИРОВАТЬ:

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

Обновление:

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

Ответы [ 2 ]

19 голосов
/ 29 января 2012

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

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

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

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

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

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

1 голос
/ 27 октября 2012

Я предлагаю использовать свойство видимости css вместо автоматической повторной инициализации. Каждый раз, когда вы вызываете метод show (), jScrollPane переинициализирует себя. Это требует времени и влияет на анимацию.

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

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