JS实现禁止用户使用Ctrl+鼠标滚轮缩放网页的方法

本文实例讲述了JS实现禁止用户使用Ctrl+鼠标滚轮缩放网页的方法。分享给大家供大家参考，具体如下：

为什么会有人会使用ctrl+鼠标滚轮缩放网页？坚决禁止！

<html>
<head>
<title>测试</title>
<script language="javascript">
 var scrollFunc=function(e){
 e=e || window.event;
 if(e.wheelDelta && event.ctrlKey){//IE/Opera/Chrome
  event.returnValue=false;
 }else if(e.detail){//Firefox
  event.returnValue=false;
 }
 }
 /*注册事件*/
 if(document.addEventListener){
 document.addEventListener('DOMMouseScroll',scrollFunc,false);
 }//W3C
 window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome/Safari
</script>
</head>
<body style="font-size:30px;">
 <br>SCRIPT脚本控制页面不随ctrl+鼠标滚轮而缩放。<br>
 <br>CSS可以控制页面文字大小不随浏览器设置而改变。
</body>
</html>

PS：这里再为大家提供一款在线javascript事件参考表供大家参考：

javascript事件与功能说明大全
http://tools.jb51.net/table/javascript_event

更多关于JavaScript相关内容感兴趣的读者可查看本站专题：《JavaScript页面元素操作技巧总结》、《JavaScript事件相关操作与技巧大全》、《JavaScript数组操作技巧总结》、《JavaScript字符与字符串操作技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript错误与调试技巧总结》

希望本文所述对大家JavaScript程序设计有所帮助。

赞 (0)

相关推荐

  • 关于meta viewport中target-densitydpi属性详解（推荐）

    关于meta viewport中target-densitydpi属性详解（推荐）

    前段时间在做WAP页面,发现页面设置了meta viewport中的大众属性,即: <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" >  但发现页面依旧不根据手机屏幕进行自动缩放,后来找其他同事帮忙解决了,我看了源代码发现了是在原来的viewport中增加了target-densitydpi属性.看之初不太了解,也因为当时自己手

  • JavaScript实现移动端页面按手机屏幕分辨率自动缩放的最强代码

    手机的屏幕有大有小,移动web最好做成响应式布局,也就是自适应屏幕,没有固定宽高,这样的话,在所有手机上都可以正常显示.关于移动端页面按手机屏幕分辨率自动缩放的js,先附上代码 <script> var phoneWidth = parseInt(window.screen.width); var phoneHeight = parseInt(window.screen.height); var phoneScale = phoneWidth/750;//除以的值按手机的物理分辨率 var u

  • jQuery实现按比例缩放图片的方法

    本文实例讲述了jQuery实现按比例缩放图片的方法.分享给大家供大家参考,具体如下: 做网站的时候,相信有很多朋友都会遇到图片过大,导致页面撑开变形的问题,如果强制设置width,height,图片则会因为强制变形而走样.在这里我介绍一种简单的按比例缩放图片的方法. 对于一堆图片 <img src="1.jpg" border="1"></img> <img src="2.jpg" border="1&qu

  • 自适应布局meta标签中viewport、content、width、initial-scale、minimum-scale、maximum-scale总结

    一.先明白几个概念 phys.width: device-width: 一般我们所指的宽度width即为phys.width,而device-width又称为css-width. 其中我们可以获取phys.width即width通过document.documentElement.clientWidth;而获取css-width通过 window.screen.width获取.如iphone6的phys.width为750px,而css-width为375px. 二.明白一个浏览器默认行为. 试

  • 学习使用Material Design控件（四）Android实现标题栏自动缩放、放大效果

    学习使用Material Design控件（四）Android实现标题栏自动缩放、放大效果

    本文要实现内容移动时,标题栏自动缩放/放大的效果,效果如下: 控件介绍 这次需要用到得新控件比较多,主要有以下几个: CoordinatorLayout 组织它的子views之间协作的一个Layout,它可以给子View切换提供动画效果. AppBarLayout 可以让包含在其中的控件响应被标记了ScrollingViewBehavior的View的滚动事件 CollapsingToolbarLayout 可以控制包含在CollapsingToolbarLayout其中的控件,在响应colla

  • 微信小程序movable view移动图片和双指缩放实例代码

    微信小程序movable view移动图片和双指缩放实例代码

    movable-area是微信小程序的新组件,可以用来移动视图区域movable-view.移动方向可选择任何.垂直和平行.可移动区域里包含其他文本.图片.按钮等组件.可移动区域可绑定touchend等事件.movable-view的参数可调整动画效果. 先从movable-view开始说起吧. movable-view是小程序自定义的组件.其描述为:"可移动的视图容器,在页面中可以拖拽滑动". 官方文档地址: https://mp.weixin.qq.com/debug/wxadoc

  • JS实现禁止用户使用Ctrl+鼠标滚轮缩放网页的方法

    本文实例讲述了JS实现禁止用户使用Ctrl+鼠标滚轮缩放网页的方法.分享给大家供大家参考,具体如下: 为什么会有人会使用ctrl+鼠标滚轮缩放网页?坚决禁止! <html> <head> <title>测试</title> <script language="javascript"> var scrollFunc=function(e){ e=e || window.event; if(e.wheelDelta &&a

  • 图片旋转、鼠标滚轮缩放、镜像、切换图片js代码

    本文实例为大家展示了图片旋转.鼠标滚轮缩放.镜像.切换图片多重效果,提供了详细的代码,分享给大家供大家参考,具体内容如下 具体代码: <!DOCTYPE html> <html lang="zh-cn"> <head> <title>图片旋转,鼠标滚轮缩放,镜像,切换图片</title> <meta charset="utf-8" /> <!--<script type="

  • 如何将Pycharm中调整字体大小的方式设置为"ctrl+鼠标滚轮上下滑"

      对于字体大小的调整,我们比较习惯的方式是ctrl+鼠标滚轮上下滑,这也是我们在大多数软件中对页面进行放大缩小的方式.但当我发现Pycharm中的字体偏小想要进行调整时,却发现使用ctrl+鼠标滚轮上下滑的方式没有反应.经过搜索查询发现,我们可以将Pycharm中的字体调整方式设置为ctrl+鼠标滚轮上下滑的方式,这是非常nice的!下面介绍一下设置过程,分为字体放大的设置与字体缩小的设置两个部分. Pycharm字体放大的设置    第一步:File → \rightarrow →Setti

  • JS实现屏蔽shift，Ctrl，alt等功能键的方法

    本文实例讲述了JS实现屏蔽shift,Ctrl,alt等功能键的方法.分享给大家供大家参考.具体实现方法如下: <script> function lock(){ if(event.shiftKey) alert("禁止按Shift键!"); } if(event.ctrlKey) alert("禁止按Ctrl键!"); } if(event.altKey) alert("禁止按alt键!"); } document.onkeydow

  • JS 屏蔽键盘不可用与鼠标右键不可用的方法

    今天做了2個小实验, 屏蔽键盘不可用 屏蔽鼠标右鍵不可用 实验一,屏蔽键盘不可用 键盘共有3個事件 a.keydown:按下键盘上某个按键时触发,一直按住某键则会持续触发 b.keypress:按下某个按键并产生字符时触发,即忽略Shift,Alt,Ctrl等功能键 c.keyup:释放某个按键时触发 复制代码 代码如下: <script language="javascript">        function block() {            event.ke

  • 鼠标滚轮控制网页横向移动实现思路

    复制代码 代码如下: <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.mousewheel.js"></script> $('body').mousewheel(function(event, delta) {

  • JavaScript实现鼠标滚轮控制页面图片切换功能示例

    本文实例讲述了JavaScript实现鼠标滚轮控制页面图片切换功能.分享给大家供大家参考,具体如下: 鼠标上的滚轮是一个不错的东东,为什么这么说,因为它能帮助我们快速的浏览网页,快速的进行长篇文章的阅读.对于web前端的我们来说又怎么能不注重这个鼠标滚轮呢,那么它能如何让用户更好的浏览网页呢? 最常见就是图片的切换了,能通过滚动滚轮进行图片的浏览,省得用户还要去点下一张,做这种繁琐的步骤.来看个简单的例子吧. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML

  • Unity3D使用鼠标旋转缩放平移视角

    Unity3D使用鼠标旋转缩放平移视角

    Unity使用鼠标旋转缩放平移视角,供大家参考,具体内容如下 用代码在Game界面完美实现Scene界面的操作方法. 使用方法:把脚本挂在相机上,把跟踪的target拖到脚本上. 视角跟踪的是一个空物体,当然如果你是做RPG游戏需要跟踪某一角色的视角,那就不需要中键平移功能,把空物体换成角色就行. 代码主要是分三部分功能进行实现. 1.右键拖动控制视角的旋转: 2.滚轮旋转控制视角的缩放: 3.中键拖动控制视角的平移. 右键拖动控制旋转主要是用GetAxis获得鼠标在x方向与y方向平移的距离,相

  • js实现的仿Photoshop鼠标滚轮控制输入框取值(修正兼容Chrome)

    一直很想做这个效果,原理是监听鼠标滚轮事件:可将此效果继续发散到其他应用上,如图片缩放,页面缩放等. 滚轮效果 -http://www.51obj.cn/ var oTxt=document.getElementById("txt"); /*********************** * 函数:判断滚轮滚动方向 * 参数:event * 返回:滚轮方向 1:向上 -1:向下 *************************/ var scrollFunc=function(e){

  • js 事件对象 鼠标滚轮效果演示说明

    js 事件对象 鼠标滚轮效果演示说明

    Mouse Wheel Data .slider { width:50px; height:180px; background:#eee; padding:10px 0; cursor:n-resize; } .slider-slot { width:16px; margin:0 auto; height:180px; background:#eee; border:1px solid gray; border-color:#999 white white #999; position:rela

随机推荐