[Intervention] Ignored attempt to cancel a touchmove event with cancelable=false, for example because scrolling is in progress and cannot be interrupted

[Pro_Certs]

Pinch zoom an image.

Does anyone else get this error:

“[Intervention] Ignored attempt to cancel a touchmove event with cancelable=false, for example because scrolling is in progress and cannot be interrupted.”

It works ok in Chrome browser with no errors but it doesn’t work on an actual Android device after building with Voltbuilder for Android and generates the error message above.

It used to work ok but now it doesn’t work.

It happens when I try to pinch zoom an image in my app, I am using pinch-zoom.js Pinchzoom.js Demo

[ghenne]

I’m not sure this is a VoltBuilder (or even AppStudio) issue.

It’s part of the continuing evolution of pinch and zoom in browsers. It’s been going on for 10 years…

[GaryGorsline]

PinchZoom,js This is a javascript driven gesture based zoom. It works on some devices and with low resolution images aok. A 10mb jpg is horrible and the bounce, …

See Posts

Picture Box sample projects won't scroll or zoom

Hello, i can’t get either of the sample projects for PictureBox to scroll or zoom, even though one project title is "PictureBox_ScrollAndZoom. I have deployed them via Volt to my iphone and also to the desktop browser, same result. The picture displays, but will not scroll or zoom. I have changed the picture to a much larger one, it displays but will not zoom either. Thoughts?

htmlView uses iScroll

HTMLView still uses IScroll - but it’s discouraged. Removing it will break a bunch of people’s software (though leaving it in is sure to be a problem in the long run too). Here’s on article on inline scroll areas: https://baymard.com/blog/inline-scroll-areas

[Intervention] Ignored attempt to cancel a touchmove event with cancelable=false, for example because scrolling is in progress and cannot be interrupted

Pinch zoom an image. Does anyone else get this error: “[Intervention] Ignored attempt to cancel a touchmove event with cancelable=false, for example because scrolling is in progress and cannot be interrupted.” It works ok in Chrome browser with no errors but it doesn’t work on an actual Android device after building with Voltbuilder for Android and generates the error message above. It used to work ok but now it doesn’t work. It happens when I try to pinch zoom an image in my app, I am usin…

I am looking, not diligently, for a CSS based function. I figure CSS is executed before Javascript, so it has to be faster.

[GaryGorsline]

Please ignore the 3rd link, fat fingers.

[Michael_Hill]

I’ve not personally used it but touch-action may be a useful starting point for using css as it includes pinch zoom support touch-action - CSS: Cascading Style Sheets | MDN

[Pro_Certs]

I removed pinch-zoom.js then added “touch-action: pinch-zoom;” to the image but that didnt work, I also tried adding “touch-action: pinch-zoom;” to the container with the mage in but also didnt work.

[Pro_Certs]

For anyone who is interested I managed to get the pinch-zoom.js working again by removing new PinchZoom.default(el, {}); from onDeviceReady and moving it to Form3_Onshow() which is the form where I display images.

I used the .js code from the demo webpage:
https://manuelstofer.github.io/pinchzoom/demo/pinchzoom.html

[GaryGorsline]

The image has to be visible when you initialize pinchzoom, or the JS code can’t find the container. It’s in the onchzoom docs.

I think what @Michael_Hill was getting at was to totally drop the pinchzoom.js and use the concepts in his link to perform the function.

Thanks Mike. I was looking for a CSS method, as the JS is way too slow on an image of any consequence. When I get a chance, I’ll try it out.