Блог

У меня есть большая диаграмма Ганта для отображения на мобильном устройстве, и она должна быть прокручиваемой. Именно тогда я создал a div.scroll-overlay на том же уровне, используя для прокрутки. Однако, наряду с поддержкой прокрутки свайпом, он не позволяет нам использовать все touch actions то, что поддерживается div.content и внутри — мы не можем щелкнуть, коснувшись кнопки div.content «Больше нет». Я пробовал и ошибался с CSS touch-action , event-pointer но пока ничего не работает.

Проблема

• Нужно div.scroll-overlay , чтобы мы могли прокручивать на мобильном устройстве, но из-за этого мы не можем коснуться / щелкнуть div.content
• Невозможно прокручивать непосредственно div.content , так как touch actions за сценой слишком много объектов, препятствующих прокрутке.

Моя идея состоит в том, чтобы сделать так, чтобы он нажимал / касался через div.scroll-overlay , so div.content или что-то внутри, что можно щелкнуть, пока div.scroll-overlay оно все еще прокручивается.

Вот Codepen, иллюстрирующий сценарий. Это не полностью отражает div.content множество интерактивных действий внутри.

Пожалуйста, посоветуйте мне, если у вас есть какое-либо решение на уме. Спасибо