Я только что нашел этот плагин 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 (ряд пустых входов), прокручивая его, если это необходимо.
Вот то, что я вижу и хочу исправить:
Когда появляется страница, сработал javascript для добавления последнего div, но вместо этого нового div, появляющегося непосредственно под оригинальным последним div, новый div проходит полностью вниз, что не видно с этой точки зрения. Единственный способ, которым я могу сделать это, - это пролистывать поля, пока я не доберусь до него. Я не могу перейти к нему.
Поведение прокрутки кажется странным. Прежде всего, нет видимого большого пальца. Я могу перетащить воображаемый большой палец вверх и вниз, что вызывает некоторую прокрутку, но в действительности все, что происходит из-за скопления div (строк) в верхней части, спрыгивают вниз, оставляя вертикальный разрыв сверху.
Когда я использую свойство verticalGutter, чтобы попытаться переместить полосу прокрутки ближе к фактическому краю содержимого, полоса прокрутки не перемещается - она растягивает мое содержимое, поэтому правый край ближе к полосе прокрутки.
расстраивает. Я думаю, может быть, мне не хватает чего-то фундаментального здесь с этим? Любая помощь наиболее ценится! (О да, я использую Chrome 17.0.963.83)
Brian