`document` event listeners break mobile pages scroll

[andreagobetti]

I noticed that there are two types of listeners, some are set on document, by using document.addEventListener(..., others are set on the elements to bee zoomed, by using massAddEventListener($zoom....

While this makes the zooming work, I noticed that after calling zoom it breaks other scrolls in my web pages, since probably the document listeners "intercept" the event and prevent it to be used to scroll.

I think I've fixed this by setting all the event listeners using massAddEventListener($zoom... instead of document.addEventListener(..., which of course is not the same, but the zoom still works and I no longer have problems related to scrolling on mobile.

If the listener on document are considered important maybe this behaviour could be managed via a setting value?

[SandyMoresoda]

This seams to do the trick! However, my image sits in a carousel... full page width, and touching the image to scroll down on mobile doesn't work..... I may make a mask that disappears on click, but which would allow a zooming afterwards.

[ehigiej]

I noticed that there are two types of listeners, some are set on document, by using document.addEventListener(..., others are set on the elements to bee zoomed, by using massAddEventListener($zoom....

While this makes the zooming work, I noticed that after calling zoom it breaks other scrolls in my web pages, since probably the document listeners "intercept" the event and prevent it to be used to scroll.

I think I've fixed this by setting all the event listeners using massAddEventListener($zoom... instead of document.addEventListener(..., which of course is not the same, but the zoom still works and I no longer have problems related to scrolling on mobile.

If the listener on document are considered important maybe this behaviour could be managed via a setting value?

I couldn't fix mine!!!!

[ehigiej]

I noticed that there are two types of listeners, some are set on document, by using document.addEventListener(..., others are set on the elements to bee zoomed, by using massAddEventListener($zoom.... While this makes the zooming work, I noticed that after calling zoom it breaks other scrolls in my web pages, since probably the document listeners "intercept" the event and prevent it to be used to scroll. I think I've fixed this by setting all the event listeners using massAddEventListener($zoom... instead of document.addEventListener(..., which of course is not the same, but the zoom still works and I no longer have problems related to scrolling on mobile. If the listener on document are considered important maybe this behaviour could be managed via a setting value?

I couldn't fix mine!!!!

Fixed it finally

[davepilbeam]

The above didn't work for me either, but the below did:

I just changed one of the handlers:

massAddEventListener($zoom,"touchmove", touchMove, {passive: false});

instead of

document.addEventListener("touchmove", touchMove, {passive: false});

First I tried replacing with

massAddEventListener("touchmove", touchMove, {passive: false});

but that didn't work either, so I targeted $zoom specifically.