Дано:
Страница, на которой все скроллбары кастомизированы плагином simplebar. По докам, чтобы подписаться на скролл нужно вешать listener на элемент, возвращаемый функцией simplebar.getScrollElement()
На странице есть таблица, которая на нешироких разрешениях скроллится по горизонтали.
Нужно:
Имитировать поведение шапки position sticky так, чтобы шапка дружила с горизонтальным скроллом таблицы.
В чём трабла:
На разрешениях без горизонтального скроллбара таблицы всё работает хорошо. Я подписался на скролл документа, прилепил шапку с нужными стилями и всё ок. Но когда есть горизонтальный скроллбар шапка остаётся зафиксирована по окну и не смешается вместе с таблицей. Чтобы синхронизировать её, я решил подписаться на горизонтальный скроллбар таблицы, так же, как на скролл всей страницы
Тут всё работает как надо. fix и stick отрабатывают в нужный момент
scrollNode.scroll (e) ->
hOffTop = header.offset().top - headerHeight
if hOffTop <= 0
lastScrollPoint = header.parents("div:first").offset().top - headerHeight
stickHead.fix(header, {
offset: headerHeight,
event: e
})
if lastScrollPoint > 0
stickHead.stick(header)
Это часть кода в stickHead.fix() - тут я хочу подписаться на горизонтальный скроллбар. Нахожу нужный мне проверкой существования fix-шапки внутри области прокрутки и достаю из него нужный элемент, пробую скроллить по горизонтали, но console.log('scroll') уже не выполняется.
if window.xScrollbars
xScrollbars = window.xScrollbars
xScrollbars.forEach (scrollbar, index) ->
el = scrollbar.getScrollElement()
posibleFixedHeader = $(el).find(selector)
if posibleFixedHeader.length > 0
console.log(el)
el.addEventListener "scroll", (e) ->
console.log('scroll')
не понимаю почему. Что можно придумать в такой ситуации? Может есть какой-нибудь динамический объект в DOM, меняющийся при скролле, на изменения которого можно подписаться?