События SVG Blocks Touch/Mousewheel

Есть ли обходной путь? Я использую собственную собственную полосу прокрутки script в отличие от использования встроенных функций браузеров. Я предпочитаю использовать SVG для своих элементов изображения по ряду причин, но одна, довольно большая ошибка - это тот факт, что трогательный или mousewheeling через svg блокирует событие и, таким образом, приводит к остановке страницы. Это особенно заметно в мобильных браузерах, где svg может занимать всю ширину документа, и в этом случае, как только вы попадете в элемент SVG, пользователь не сможет прокрутить его.

Я не тестировал в IE, но в Chrome команды касания не работают поверх SVG, а в Firefox события с колесиками - проблема. Я предполагаю, что это будет как на IE haha.

Порядочным решением было бы как-то добавить событие к моим элементам SVG, поймать события и передать их на события прокрутки. Я не могу найти способ. Еще лучше было бы как-то разместить документ над SVG, чтобы SVG не мешал прокрутке вообще. Опять же, похоже, не найти способ.

Я вставляю элементы SVG с тегами объектов, что важно по целому ряду причин. Я предполагаю, что тег объекта на самом деле является виновником.

Ответ 1

Комментарий к Duopixel. Добавление:

object {
    pointer-events: none;
}

В css проблема решена как в Firefox, так и в Chrome. Мне все еще нужно тестировать в IE, но пока это кажется лучшим и самым простым решением.

Хорошая статья, объясняющая атрибут событий указателя, можно найти в http://davidwalsh.name/pointer-events

Если проблемы, упомянутые выше, являются проблемой в IE, вы можете использовать решение javascript, которое требует захвата позиции указателя и передачи его правильному элементу. Рабочая версия, которая использует jQuery, но может быть легко переведена на javascript в vanilla, можно найти здесь: http://jsbin.com/uhuto/1/edit