gajus / brim

View (minimal-ui) manager for iOS 8.
http://gajus.com/sandbox/brim/demo/
Other
391 stars 41 forks source link

User can zoom (pinch-out) the mask element and break brim #26

Open paolobertani opened 7 years ago

paolobertani commented 7 years ago

Let's consider the brim demo:

when the minimal-ui is disabled and the mask element is displayed the user can do a pinch-out (zoom-in) gesture.

This results in the ui switching to minimal, viewport content being zoomed but brim does not recognize that the UI is not minimal.

Is there a way to let the user scroll the mask element but forbid zoom gesture ?

gajus commented 7 years ago

http://stackoverflow.com/questions/4389932/how-do-you-disable-viewport-zooming-on-mobile-safari

paolobertani commented 7 years ago

Among the many obsolete or wrong answers the only that works is:

document.addEventListener( 'gesturestart', function (e) { e.preventDefault(); } );

I tried it (in the simulator) and gesturestart is supported at least since iOS 8.1

Preventing default of gesturestart disables zoom but still leaves the user ability to scroll (opposite to preventing touchmove that disables both)

The only problem is that while scrolling the user can lay down a second finger and be able to zoom.

Depending on the user's gesture its action may resuls in the ui switching to minimal (and upon touch release the mask disappears and the main element appears not scaled) or may result in the web page stuck on the mask element.

Anyway I would suggest to add the above line of code the the brim demo as "mitigates" the problem.

I also kindly ask you if you have any idea to disable zoom, let scroll AND disable zoom while scrolling.