IE 10 禁用多点触摸放大缩小页面

最近在做项目的时候，要求禁用页面的放大缩小功能，在可触摸的终端，是可以通过多手指去放大缩小页面的，通常我们都是通过加<meta>标签：

<meta name="viewport" content="width=device-width ,
initial-scale=1.0 , maximun-scale=1.0 , user-scalable=no">

但其实这样根本没用，于是我又通过监听touchstart touchmove 进行拦截（当触摸屏幕的手指 >=2 时才拦截事件），但是发现在 IE10 上面根本没有作用，还是能够通过手指去放大缩小界面，其他浏览器就正常，经过调试发现，IE10下根本就没有走touch相关的事件，没有监听到当然也就无法拦截了，这下让我很懵逼，IE 系列总是这么让人头疼。。。。

没办法，问题还是要解决的，怎么办呢，于是上官网找了找了 ，总算找到了解决方法 ,以下是官方代码：

Advanced gesture input

<style>    html {        overflow: hidden;        -ms-content-zooming: none; /* Disable pan/zoom */    }    #foo {        background-color: red;        width: 500px;        height: 500px;        -ms-transform-origin: 50%;        -ms-transform-origin: 50%;    }</style><div id=”foo”></div><script>    function handleEvent(event) {        event.target.style.msTransform = “scale(“ + event.scale + “)”;    }    document.getElementById(“foo”).addEventListener(“MSGestureChange”, handleEvent, false);</script>

详情请点击：Touch Events For IE 10

主要看html中的样式 ：

-ms-content-zooming:none;

没错就是这一句，就解决了。有点坑爹啊，IE总是喜欢搞事，真是害苦了我们搞前端的。