I have an issue with zooming. I want to block pinch to zoom in Mobile Safari on HTML elements. I use script to prevent default behavior of browser and it is working fine for normal pinching, but when I start scroll with one finger and later add second and pinch Safari still zooming the page...
Has anyone any idea how can I block this zooming?
I'am creating mobile game using canvas and use HTML for message windows so please don't write that it is a bad idea to block zooming for accessibility reasons.
Code to prevent zooming:
document.addEventListener("touchmove", function(event) {
event = event.originalEvent || event;
if(event.touches.length > 1 || event.scale > 1) {
event.preventDefault();
}
}, false);
UPDATE:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
This meta tag doesn't work because Apple disable it in Mobile Safari since iOS 10 up to accessibility reasons
can you test it?
document.documentElement.addEventListener('touchmove', function (event) {
event.preventDefault();
}, false);
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.