Как сделать пользовательские полосы прокрутки с помощью jScrollPane всегда видимыми?

Question

У меня есть полосы прокрутки с помощью jScrollPane плагина для jQuery.

Прокрутка работает, все содержимое с AJAX, поэтому для каждой загрузки страницы я добавляю повторную инициализацию полос прокрутки. Но когда контент короче страницы, полосы прокрутки не видны.

Это приводит к увеличению пространства на 10 пикселей для контента, и это раздражает элементы, использующие 100% доступного пространства.

Кто-нибудь знает, как сделать полосы прокрутки видимыми, даже если контент недоступен? Или альтернативный способ CSS для резервирования пространства тоже прекрасен.

Answer 1

Если никто не найдет лучшее решение,

я уже могу сказать, что я модифицирована JScrollPane плагин, чтобы всегда показывать «дорожки» бар, и, если он собирался скрыть полосу прокрутки (потому что содержание было меньше, чем view) Я также не добавляю панель «drag». хотя это не очень чистый вариант.

необходимо принять дополнительные меры, а также отключить/повторно включить кнопки вверх, добавив функцию css, чтобы не наводить/активировать состояние, когда оно отключено ... для лучшего удобства использования.

еще с нетерпением ждет возможного лучшее решения, хотя я чувствую, что я буду придумал единственно возможным решением, как там, вероятно, не будет ни из коробки

Answer 2

Я думаю, что пока эта функция не будет добавлен в JScrollPane там это только грязные трюки, которые можно исправить. Я попросил jScrollPane, если прокрутка включена; Если нет, я добавил div, который выглядит как пустая/запрещенная полоса прокрутки. Это код:

var scrollPane = $("#id-of-scroll-area"); 
scrollPane.css("height", "100%"); // I needed this; you may not 
var scroll = scrollPane.jScrollPane(); 
// check if scrolling is enabled 
if (!scroll.data('jsp').getIsScrollableV()) { 
    scrollPane.css("overflow-y", "hidden"); 
    scrollPane.css("width", leftPane.width() - 10); // 10 is width of scroll bar 
    scrollPane.after('<div id="white-v-bar">&nbsp;</div>'); 
} 

Hop это поможет кому-то ... Markus

Это CSS для бара фиктивной прокрутки:

#white-v-bar { 
height:100%; 
width:10px; 
background-color:white; 
float:left; 
}