Как сделать переполнение: автоматический контейнер после итерации элемента списка

Question

У меня есть контейнер div, установленный на overflow:auto, который содержит множество <li>.Я написал простую функцию для изменения выделенного элемента списка, когда пользователь нажимает кнопку или нажимает стрелки вверх или вниз.

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

. Вот пример того, что я пытаюсь сделать: http://jsfiddle.net/sadmicrowave/rwfUr/

Помните - вверх и внизстрелки делают прокрутку контейнера (пока контейнер имеет фокус), а кнопка итерации - нет.

Важно - Я ищу альтернативу .scrollTo ()

Answer 1

А как насчет .scrollIntoView () ?

Answer 2

Чтобы сделать это программным способом, вам нужно получить высоту элемента и высоту коробки.

Когда прокручивать: (высота поля - (номер выделенного элемента * высота элемента) <0) </strong> Используйте свойство scrollTop для прокрутки списка по высоте элементов, в то время как приведенное выше меньше 0.

Надеюсь, это поможет.

:: Редактировать :: Это будет работать только в том случае, если высота блока точно соответствует указанному количеству элементов списка. Допустим, высота каждого элемента составляет 20 пикселей, и вы хотите, чтобы в списке отображалось 10 элементов, тогда вам нужно установить высоту списка в 200 пикселей.