I've got an InDesign magazine which contains a Web Content Overlay (pointing to a responsive web site). Everything works fine apart from when it comes to scrolling.

I'm running the magazine from an iPad via Adobe Viewer. Only vertical scrolling (up and down) is required, horizontal isn't.

Problem

When the user swipes left or right, the magazine's page changes and the web content closes.

Question

Is there any way that I can prevent scroll events from propagating up to the magazine from the web content overlay? Preferably, this would be done from the web content itself (e.g. using JavaScript) as it would mean I would only have to edit in one place, rather than on each page the web content is shown.

Attempted

Catching the touchmove event on the page's body and calling stopPropagation() on it.

Calling preventDefault() on the event (this stops any scrolling at all).

Using pageX on touchmove events and calling preventDefault() on any ones that look to be horizontal swipes (too unreliable).

Note that I've set a static width of `701`, this is important. The web content overlay's width is `700px`. Setting a width of `701` means that the page can move ever so slightly. This wiggle means that the swipe left/right is caught and not percolated up to InDesign. There is a slight shift (by a pixel) if they do swipe, but it's minor compared to changing page.