vue 控制窗口禁止缩放,已解决

注意:不是浏览器窗口禁止缩放

1.vue框架中,index.html文件head标签中加上内容

css 复制代码
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
    <script>
      document.addEventListener('mousewheel', function (e) {
        e = e || window.event;
        if ((e.wheelDelta && event.ctrlKey) || e.detail) {
          event.preventDefault();
        }
      }, {
        capture: false,
        passive: false
      });
    </script>
    <style>
      html {
        -ms-content-zooming: none;
      }
    </style>

2.App.vue中加上

css 复制代码
  mounted() {
// 禁止双击缩放
    window.onload = function() {
      document.addEventListener('touchstart', function(event) {
        if (event.touches.length > 1) {
          event.preventDefault()
        }
      })
      document.addEventListener('gesturestart', function(event) {
        event.preventDefault()
      })
    }
  },

完活儿!

相关推荐
β添砖java3 分钟前
CSS3核心技术
前端·css·css3
空山新雨(大队长)16 分钟前
HTML第八课:HTML4和HTML5的区别
前端·html·html5
猫头虎-前端技术1 小时前
浏览器兼容性问题全解:CSS 前缀、Grid/Flex 布局兼容方案与跨浏览器调试技巧
前端·css·node.js·bootstrap·ecmascript·css3·媒体
阿珊和她的猫1 小时前
探索 CSS 过渡:打造流畅网页交互体验
前端·css
元亓亓亓1 小时前
JavaWeb--day1--HTML&CSS
前端·css·html
β添砖java1 小时前
CSS的文本样式
前端·css
前端小趴菜051 小时前
css - 滤镜
前端·css
祈祷苍天赐我java之术1 小时前
理解 CSS 浮动技术
前端·css
索迪迈科技1 小时前
Flex布局——详解
前端·html·css3·html5