禁止移动端(IOS)双击页面变大

2020-04-07  本文已影响0人  Reclame

查了很多资料,都说在head标签里面加入。

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

实际上还是可以双击页面变大的,最后想到的就是事件监听,touchstart,touchend。

let touchTime = 0;
document.addEventListener('touchstart', function(event) {
  if (event.touches.length > 1) {
    event.preventDefault();
  }
});
document.addEventListener('touchend', function(event) {
  //记录当前点击的时间与下一次时间的间隔
  var nowTime = new Date();    
  if (nowTime.getTime()  - touchTime <= 300) {
    event.preventDefault();
  }
  touchTime = nowTime.getTime();
}, false);

再一次双击页面的时候,不会放大了,成功解决了

上一篇 下一篇

猜你喜欢

热点阅读