js实现禁止网页缩放(Ctrl+鼠标、+、-缩放有效亲测)

简介: js实现禁止网页缩放(Ctrl+鼠标、+、-缩放有效亲测)背景:现在是凌晨1:35我还在帮客户修改网页,要求不高但来钱快,学生党不容易啊,客户提到了很多网页的优化,其中这一条让我头疼了许久,大家就不用踩坑了,看下面的就可以了...

在这里插入图片描述

背景:现在是凌晨1:35我还在帮客户修改网页,要求不高但来钱快,学生党不容易啊,客户提到了很多网页的优化,其中这一条
让我头疼了许久,大家就不用踩坑了,看下面的就可以了

禁止滑轮:

 window.addEventListener('mousewheel', function(event){
        if (event.ctrlKey === true || event.metaKey) {
              event.preventDefault();
        }
      },{ passive: false});

      //firefox
      window.addEventListener('DOMMouseScroll', function(event){
          if (event.ctrlKey === true || event.metaKey) {
                event.preventDefault();
          }
      },{ passive: false});

禁止+、- :

window.onload = function() {
  document.addEventListener('keydown', function (event) {
        if ((event.ctrlKey === true || event.metaKey === true)
            && (event.which === 61 || event.which === 107
            || event.which === 173 || event.which === 109
            || event.which === 187  || event.which === 189))
        {
            event.preventDefault();
        }
    }, false);
}

完整代码:

<script>
//luwenjie hualun
      window.addEventListener('mousewheel', function(event){
        if (event.ctrlKey === true || event.metaKey) {
              event.preventDefault();
        }
      },{ passive: false});

      //firefox
      window.addEventListener('DOMMouseScroll', function(event){
          if (event.ctrlKey === true || event.metaKey) {
                event.preventDefault();
          }
      },{ passive: false});
//+_
window.onload = function() {
  document.addEventListener('keydown', function (event) {
        if ((event.ctrlKey === true || event.metaKey === true)
            && (event.which === 61 || event.which === 107
            || event.which === 173 || event.which === 109
            || event.which === 187  || event.which === 189))
        {
            event.preventDefault();
        }
    }, false);
}


</script>

看个轮廓就可以了哈,反正两个都不会缩放,今天就到这里!
在这里插入图片描述

相关文章
|
6天前
|
编解码 前端开发 JavaScript
javascript检测网页缩放演示代码
javascript检测网页缩放演示代码
|
8天前
|
Web App开发 JavaScript 前端开发
添加浮动按钮点击滚动到网页底部的纯JavaScript演示代码 IE9、11,Maxthon 1.6.7,Firefox30、31,360极速浏览器7.5.3.308下测试正常
添加浮动按钮点击滚动到网页底部的纯JavaScript演示代码 IE9、11,Maxthon 1.6.7,Firefox30、31,360极速浏览器7.5.3.308下测试正常
用CSS+JavaScript打造网页中的选项卡
用CSS+JavaScript打造网页中的选项卡
|
26天前
|
Web App开发 前端开发 JavaScript
HTML/CSS/JS学习笔记 Day3(HTML--网页标签 下)
HTML/CSS/JS学习笔记 Day3(HTML--网页标签 下)
|
6天前
|
JavaScript 前端开发
用JavaScript编程控制网页上checkbox选择状态:全选、全部取消、反选
用JavaScript编程控制网页上checkbox选择状态:全选、全部取消、反选
|
9天前
|
JavaScript 前端开发
【原创】用JavaScript动态获取网页中缩放图片的长度、宽度和显示比例
【原创】用JavaScript动态获取网页中缩放图片的长度、宽度和显示比例
|
9天前
|
JavaScript 前端开发
网页前端课程设计-【模仿】香港中文大学官网,轮播图及div+css布局,js的dom操作
这篇文章介绍了如何模仿香港中文大学官网进行网页前端课程设计,包括使用div+css布局、js的DOM操作以及实现轮播图等技术细节。
|
9天前
|
前端开发 JavaScript
前端JS控制网页复制粘贴
前端JS控制网页复制粘贴
|
2月前
|
Web App开发 JavaScript 前端开发
使用Python调用JavaScript进行网页自动化操作
使用Python调用JavaScript进行网页自动化操作
|
2月前
|
前端开发 程序员
HTML+CSS+JavaScript制作动态七夕表白网页(含音乐+自定义文字)
一年一度的520情人节/七夕情人节/女朋友生日/程序员表白,是不是要给女朋友或者正在追求的妹子一点小惊喜呢,今天这篇博客就分享下前端代码如何实现HTML+CSS+JavaScript制作七夕表白网页(含音乐+自定义文字)。赶紧学会了,来制作属于我们程序员的浪漫吧!
50 0
HTML+CSS+JavaScript制作动态七夕表白网页(含音乐+自定义文字)