Веб-серфинг, скроллируемые элементы внутри страницы

Question

[_ _]

В очередной момент поймал себя на мысли, что практически рефлекторно скриплю зубами, когда происходит следующее:

• Просматриваю страницу, достаточно длинную, чтобы иметь длинный вертикальный скролл
• Лихо скроллю страницу по вертикали
• В момент скроллинга курсор оказывается над страничным элементом, у которого тоже есть скролл
• Holy sh..t, какого черта скроллинг страницы останавливается, и начинает скроллироваться этот элемент?

У меня, если что, хром. Но, если я не ошибаюсь, в остальных браузерах, которыми я по мере надобности пользуюсь, происходит ровно то же самое.
События скролла, вероятней всего, дискретные. Почему нельзя сделать какой-то таймер, чтоль, который бы определял, закончился предыдущий «сеанс» скролла или нет? Ведь если между событиями проходит, например 0.2с. вероятней всего это я продолжаю начатый скролл, и не надо передавать фокус скролла другому элементу.

Answer 1

[Илья Юсупов]

Вот, написал простенький userscript. При прокрутке страницы на пятьсот миллисекунд отключается, скажем так, прокручиваемость всех остальных элементов. Правда, скрипт не поможет на сайтах, на которых прокрутка нестандартная.

Код для проверки на JsFiddle.

Comments

[Дмитрий Харитонов]

Установил, обрадовался. Но есть лаги. Например, поскролльте залогиненым на гитхабе на главной странице, все начнет «плясать». Или тут http://geakstr.postach.io/ — обрезается аватарка сверху-справа и буллиты у маркированного списка внизу.

[Илья Юсупов]

Да, действительно, я не подумал, что «overflow: hidden» испортит многое. По-хорошему нужно было бы применять стиль лишь к элементам со «scroll: auto» или «overflow: scroll», только вот есть проверять скриптами стили всех элементов на странице — получится очень медленно.

Сейчас попробую ещё кое-что, есть одна идея.

[Илья Юсупов]

На всякий случай, вот расширение для Chrome (не мог выложить раньше — интернет отвалился, увы).

Добавляет новый пункт в контекстное меню (из-за этого обычного userscript'а уже не хватило: увы, не умеет Chrome в новые пункты контекстного меню), при клике по которому появится окошко с CSS-селектором для ближайшего к кликнутому объекта, который имеет смысл поправить («auto» или «scroll» в «overflow»). Скорее всего, селектор нужно будет оптимизировать, но работать должно и так.

Селекторы сохраняются в localStorage, то есть правило, созданное на одной страничке, будет действовать на всём сайте. Для очистки всех правил можно (ну, кроме варианта поправить значение в localStorage) написать «sf_reset» (без кавычек) в консоль.

Исходный код здесь (вряд ли стоит выкладывать такой простенький плагин на GitHub).

[Дмитрий Харитонов]

Круто, спасибо!

Answer 2

[Дмитрий Харитонов]

Как я понимаю вашу боль… Тоже интересно, есть ли какое-нибудь решение проблемы (вероятно, расширение к браузеру).