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>

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

相关文章
|
5月前
|
JavaScript 算法 开发者
如何用JS实现在网页上通过鼠标移动批量选择元素的效果?
本文介绍了类似电脑桌面通过鼠标选择多个图标的实现原理。主要通过监听mousedown、mousemove和mouseup事件,动态调整选择框大小并计算与元素的重叠情况。提供了角重叠和相交重叠的检测方法,并附有示例代码和在线演示链接,方便开发者参考与测试。
187 56
|
4月前
|
Web App开发 数据采集 JavaScript
动态网页爬取:Python如何获取JS加载的数据?
动态网页爬取:Python如何获取JS加载的数据?
808 58
|
1月前
|
编解码 JavaScript 前端开发
如何在网页播放英文的m3u8文件(基于Javascript搭建的在线网页工具)
什么是m3u8?又该如何在网页中高效、便捷地播放英文的m3u8文件呢?今天这篇文章就带你一起了解,并推荐一种基于Javascript搭建的在线网页工具,让你轻松解决播放问题。
605 0
|
4月前
|
数据采集 Web App开发 JavaScript
Python爬虫如何获取JavaScript动态渲染后的网页内容?
Python爬虫如何获取JavaScript动态渲染后的网页内容?
|
11月前
|
存储 JavaScript 前端开发
使用JavaScript构建动态交互式网页:从基础到实践
【10月更文挑战第12天】使用JavaScript构建动态交互式网页:从基础到实践
495 1
|
10月前
|
缓存 JavaScript 前端开发
JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用
本文深入讲解了 JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用。
335 5
|
11月前
|
存储 JavaScript 前端开发
【JavaScript】网页交互的灵魂舞者
本文介绍了 JavaScript 的三种引入方式(行内、内部、外部)和基础语法,包括变量、数据类型、运算符、数组、函数和对象等内容。同时,文章还详细讲解了 jQuery 的基本语法和常用方法,如 `text()`、`html()`、`val()`、`attr()` 和 `css()` 等,以及如何插入和删除元素。通过示例代码和图解,帮助读者更好地理解和应用这些知识。
115 1
【JavaScript】网页交互的灵魂舞者
|
10月前
|
数据采集 存储 监控
实现自动化数据抓取:使用Node.js操控鼠标点击与位置坐标
本文介绍了如何使用Node.js和Puppeteer实现自动化数据抓取,特别是针对新闻网站“澎湃新闻”。通过设置代理IP、User-Agent和Cookie,提高爬虫的效率和隐蔽性,避免被网站封锁。代码示例展示了如何模拟鼠标点击、键盘输入等操作,抓取并整理新闻数据,适用于需要规避IP限制和突破频率限制的场景。
433 10
|
10月前
|
JavaScript
JS鼠标框选并删除HTML源码
这是一个js鼠标框选效果,可实现鼠标右击出现框选效果的功能。右击鼠标可拖拽框选元素,向下拖拽可实现删除效果,简单实用,欢迎下载
98 4