Настройка jScrollPane - PullRequest
       6

Настройка jScrollPane

1 голос
/ 28 марта 2012

Я только что нашел этот плагин jScrollPane, пытаюсь настроить его и работать на моей странице. На моей странице у меня есть внешний div

< div id="myList" class="scroll-pane" >

, который оборачивает несколько других элементов div - каждый из внутренних элементов div по сути представляет собой одну строку на экране с 3 полями ввода. Таким образом, при первой загрузке экрана на стороне сервера создается достаточно div для отображения существующих записей из базы данных. Затем после рендеринга страницы я использую javascript для создания одного дополнительного div (строки) с пустыми полями ввода для ввода данных. Вот css для класса 'scroll-pane':

.scroll-pane {
    width: 100%;
    height: 380px;
    overflow: auto;
}

Вот мои настройки jScrollPane - это в $ (документ) .ready (function () - это просто так:

$('#myList').jScrollPane();

следующая вещь в $ (document) .ready () - это то, где я добавляю новый div с пустыми входами. Там я сделал это по примеру, который я видел в документации, так что это выглядит так:

    var newItemHTML = '<div> .... </div>';
    var newItem = $(newItemHTML);
    var pane = $('#myList');
    pane.jScrollPane();
    var api = pane.data('jsp');
    api.getContentPane().append(newItem);
    api.reinitialise();
    api.scrollToBottom();

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

  1. Когда появляется страница, сработал javascript для добавления последнего div, но вместо этого нового div, появляющегося непосредственно под оригинальным последним div, новый div проходит полностью вниз, что не видно с этой точки зрения. Единственный способ, которым я могу сделать это, - это пролистывать поля, пока я не доберусь до него. Я не могу перейти к нему.

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

  3. Когда я использую свойство verticalGutter, чтобы попытаться переместить полосу прокрутки ближе к фактическому краю содержимого, полоса прокрутки не перемещается - она ​​растягивает мое содержимое, поэтому правый край ближе к полосе прокрутки.

расстраивает. Я думаю, может быть, мне не хватает чего-то фундаментального здесь с этим? Любая помощь наиболее ценится! (О да, я использую Chrome 17.0.963.83)

Brian

...