How To Disable Zoom In Mobile Responsive?

I have written this code for disabling zoom in or out:

Solution 1:

I finally figured out how to prevent it on ios 10. First, i found an article where it says that since ios 10, the use of viewport meta is kinda ignored from safari; here's the link.

Then, that's the solution i found out as workaround:

$(this).on('touchmove', function (event) {
    if (event.originalEvent.scale !== 1) {
        event.preventDefault();
        event.stopPropagation();
    }
});

Notes:

• event.preventDefault(); should works by itself without using event.stopPropagation();. I added it just to be sure other elements won't catch the pinch.
• I tested it on ipad and iphone, and it works good.
• I also used the <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" > for the other devices.

Share