Html-свиток: как этого избежать, чтобы «вырезать» мои внутренние элементы

Question

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

В основном он состоит из элемента div, содержащего элементы предложения, каждый из которых также является элементом div.

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

Если вы используете прокрутку, она прокручивается вверх или вниз в «пикселях», поэтому она обрезает мои элементы, заставляя все это выглядеть совсем не гладко.

Я бы хотел переопределить поведение для перехода вверх и вниз на один элемент div, когда вы используете прокрутку. Я даже не знаю, как Google для этого ...

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

Большое спасибо заранее

Примечание: я не могу использовать плагин автозаполнения jquery.

Answer 1

Первый:

Используя собственную полосу прокрутки, создайте обработчик события прокрутки. Здесь вы можете использовать анимацию delta (она находится в evt), для которой вы можете установить scrollTop элемента самостоятельно с помощью offsetHeight вашего верхнего или нижнего видимого элемента. Также, если высота div обрезает элемент, просто сделайте предыдущий или следующий элемент немного «выше», иначе установите его высоту, чтобы толкать обрезанный элемент вверх или вниз.

Второе:

Вы можете "исправить" div, чтобы были видны только несколько элементов. и пока вы прокручиваете, вы скрываете верхний и отображаете нижний в анимации, не используя s crollTop или scrollHeight.

Следите за событием прокрутки в Firefox. У него есть другое имя, но вы можете проверить его так:

eventName = eventName === 'mousewheel' ? ((/Firefox/i.test(navigator.userAgent)) ? "DOMMouseScroll" : eventName) : eventName;

Удачи. Если вам понадобится помощь в течение 2 дней, я ее осуществлю, потому что она мне тоже нужна.

Answer 2

Не могли бы вы подключиться к событию «прокрутка» для этого элемента (DOM 3 Events предоставляет событие прокрутки для элемента, не уверен, насколько оно поддерживается), так что всякий раз, когда позиция прокрутки изменяется, она вызывает небольшую процедуру вашей собственной, которая регулирует положение прокрутки, округляя ее до ближайшего надреза?

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

Answer 3

Вы можете реализовать собственную полосу прокрутки, используя события мыши и обновляя позиции вручную.

Answer 4

Это просто невозможно сделать , решения не существует, точка. Надо жить с этим ограничением.

Почему нет решения?

Потому что даже если вы реализуете свою собственную полосу прокрутки, вам все равно придется полагаться на события прокрутки, и их нельзя ни отменить, ни предотвратить от появления пузырьков в элементе тела. На самом деле, они не могут, вы можете вызывать на них функции warnDefault () и stopPropagation (), пока коровы не вернутся домой, и они все еще будут пузыриться. Это преднамеренное решение со стороны органа стандартизации и разработчиков браузеров.

Если события прокрутки можно отменить, EхpеrtEхchangе может помешать вам прокручивать страницу вниз, чтобы увидеть ответ;) (не волнуйтесь, я использовал некоторые буквы кириллицы в «EхpеrtEхchangе», чтобы они не получали индексируемую говоря).