Колесо прокрутки мыши в Polymer ядра-свитка заголовок панели не работает, когда курсор мыши находится над колонковой панелью

Question

Это демонстрационный от polymer-project.org для ядра свитка-заголовок панели: https://www.polymer-project.org/0.5/components/core-scroll-header-panel/demo.html

что случилось:
положить мышь над некоторым элементом списка и прокрутите колесо мыши вниз
=> вы увидите, что все содержимое (список) прокручивается и ядро-панель изменяет высоту до некоторой минимальной высоты, а затем прокручивать вверх над экран.
Все в порядке.

Теперь наведите курсор мыши на панель инструментов ядра и прокрутите колесо мыши вниз.
= > ничего не произойдет

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

Например, страница из документации не имеет таких проблем (https://www.polymer-project.org/docs/elements/core-elements.html#core-scroll-header-panel). Похоже, что он использует другие полимерные компоненты (или, может быть, не полимер, я не знаю).

Спасибо за любую помощь.

Answer 1

Это происходит потому, что core-scroll-header-panelheaderContainer (внутри его Теневой DOM) блокирует прокрутку.

Одно из возможных решений - отключить его от получения событий касания или мыши, установив pointer-events в none.

core-scroll-header-panel::shadow #headerContainer { 
    pointer-events: none; 
}