Как я могу остановить прокрутку хрома, чтобы сфокусировать выбор
Я работаю над элементом управления, в котором у вас будет два списка множественного -выбора с коллекциями элементов, которые можно перемещать между собой.
Существует вероятность того, что содержимое одного или обоих списков будет шире, чем я хотел бы, чтобы был сам элемент, поэтому каждый из них представлен двумя div и select следующим образом:
Помещение select в div позволяет использовать горизонтальную прокрутку (, так как select не ). Атрибут размера select изменяется (и устанавливается )в соответствии с его содержимым при добавлении или удалении элементов. Div «маскирующий» во избежание двойных полос прокрутки скрывает вертикальную полосу прокрутки при выборе и имеет вертикальный размер при изменении выбора.
Я использую html5. IE9 в стандартном режиме и Firefox в порядке. Проблема, с которой я столкнулся, связана с Chrome (на самом деле Safari, так что... webkit ).Если элемент управления находится в окне или контейнере (div, например )с вертикальной прокруткой, и вы прокручиваете его до точки, где вы не можете видеть верхнюю часть выбора, если нижняя часть выбора виден (или был бы виден во внешнем контейнере, если бы можно было увидеть переполнение ), когда вы щелкаете элемент в выборе, в результате чего выделение фокусируется, Chrome прокручивает внешний контейнер либо вверх, либо достаточно далеко, чтобы что верхняя часть выбора будет видна, если вы сможете увидеть ее через содержащие ее элементы div.
Как уже отмечалось, если самая нижняя -опция выбора видна в окне (, содержащем ), а верхняя часть выбора — нет, хром будет прокручиваться.
Я написал сценарий, чтобы настроить scrollTop прокручиваемого окна обратно в его текущую позицию, и что будет работать, за исключением того, что я обнаружил, что в моих промежуточных и производственных средах настройка, выполняемая хромом, также в результате чего фактический выбор параметра происходит ПОСЛЕ того, как хром выполнил свою собственную настройку, что означает, что щелчок регистрируется на неправильном параметре (он выключен, насколько браузер прокручивал вверх ), это проблема, есть ли событие onfocus на выбирать или нет.
Мне не удалось решить проблему выбора опции в базовом тесте, подобном этому, но прокрутка сама по себе является проблемой.
Единственный способ, который я нашел, чтобы предотвратить это, - это размер выбора до некоторого числа, достаточно большого, чтобы поместить нижнюю часть выбора далеко за пределы нижней части внешнего контейнера, но это совсем не идеально, так как оставляет много пробелов, плохо работает с пользователем и борется с проблемой, которая (, хотя и довольно глубокая, )влияет только на webkit.
Кто-нибудь знает, как еще я могу предотвратить или противодействовать этому поведению?
У меня были изображения, чтобы пойти с этим, но понятно,новые пользователи не могут публиковать изображения. Вот скрипт js, который позволит вам легко воспроизвести проблему:http://jsfiddle.net/4N9Kg/22/