On a touch enabled device, zoomable images might prevent the possibility to scroll the page

[seiz]

Lets say you look at a page with a couple of large images (one below another) on an iPad and all images on the page are zoomable.

If you want to scroll the page, you place your finger on the screen and swipe up.
If you had placed your finger over an image by coincidence and start swiping, you're not initiating a page scroll, but an image zoom (image zooms in and zoomed in state moves).

Does anyone have an idea how we could improve this (i.e. measure the delay between touch down and swipe to figure out the users intent)?

[seiz]

In the mean time, i solved this like follows:

I call zoom with on:"click", so the zoom gets started by a "click"-event.
Then, in jquery.zoom.js, i made a little change to disable touchstart and touchend, if on is "click", so even on touch devices, one would only start the image zoom when one taps the image and not by swiping (over it) to scroll the page.

Seems to work nicely for my use case.

[tomblanchard]

Thanks @seiz! This worked perfectly for my use-case also :) U-da-man.

[Rafrobeat]

Thanks a lot @seiz! This worked perfectly for my case.

[uar-marko]

Thank you @seiz! worked for me too, is there option to un-zoom on some event. It triggers on touch but I cant get out of zoom afterwards?

[vitormicillo]

I don't know why, for me doesn't work :-(