JS-鼠标滚轮事件 和 阻止默认行为
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body style="height: 2000px;">
<style type="text/css">
#div1{width:100px;height:100px;background: red;}
</style>
<script type="text/javascript">
window.onload = function(){
var oDiv = document.getElementById('div1'); /*
ie/chrome : onmousewheel
event.wheelDelta //firefox 下没有这个属性
上 ： 120
下 ：-120 firefox : DOMMouseScroll 必须用addEventListener
addEventListener 必须是标准浏览器才支持 （ie6 7 8 用的是attachEvent）
event.detail
上：-3
下：3 return false 阻止的是 obj.on事件名称=fn 所触发的默认行为
addEventListener绑定的事件需要通过event下面的preventDefault();
*/
oDiv.onmousewheel = fn;
if(oDiv.addEventListener){
oDiv.addEventListener('DOMMouseScroll', fn ,false);
} function fn(ev){
//alert()
var ev = ev || event;
//alert(ev.wheelDelta);
//alert(ev.detail) var b = true;
if(ev.wheelDelta){
b = ev.wheelDelta > 0 ? true : false
}else{
b = ev.detail < 0 ? true : false
}
//alert(b)
if(b){
this.style.height = this.offsetHeight - 10+'px';
}else{
this.style.height = this.offsetHeight + 10+'px';
} if(ev.preventDefault){
ev.preventDefault();
}
return false;
} }
</script> <script type="text/javascript">
//return false 阻止的是 obj.on事件名称=fn 所触发的默认行为
// addEventListener绑定的事件需要通过event下面的preventDefault();
//阻止默认行为是根据事件的绑定决定的 //右键行为阻止
var context1 = function(){
document.oncontextmenu = function (){// chrome
return false;
} }
//context1() //标准浏览器 var context2 = function (){
document.addEventListener('contextmenu',function(ev){
ev.preventDefault();
//return false;
})
}
//context2() var context3 = function(){
document.attachEvent('contextmenu',function(){
return false;
})
}
context3() //IE非标准 </script>
<div id="div1"></div>
</body>
</html>
JS-鼠标滚轮事件 和 阻止默认行为的更多相关文章
- js鼠标滚轮事件兼容
JavaScript鼠标滚轮事件 IE6.0首先实现了鼠标的滚轮事件,其良好的交互效果得到认可,随后Opera.chrome.safari等主流浏览器都实现了该效果,不过存在着很大的兼容问题. 大多数 ...
- JS鼠标滚轮事件解析
一.不同浏览器的鼠标滚轮事件 首先,不同的浏览器有不同的滚轮事件.主要是有两种,onmousewheel(IE/Opera/Chrome支持,firefox不支持)和DOMMouseScroll(只有 ...
- js鼠标滚轮事件
不多说,直接上代码. //非ie document.body.onmousewheel = function(event) { event = event || window.event; conso ...
- JS鼠标滚轮事件详解
鼠标滚轮事件 //兼容性写法,该函数也是网上别人写的,不过找不到出处了,蛮好的,所有我也没有必要修改了 //判断鼠标滚轮滚动方向 if (window.addEventListener)//FF,火狐 ...
- JS 鼠标滚轮事件（mousewheel/DOMMouseScroll）
onmousewheel (FireFox不支持此事件) // IE/Opera/Chrome/Safari document.body.onmousewheel = function(event) ...
- js鼠标滚轮事件上滚下滚判断
onmousewheel <script> var scrollFunc = function (e){ //其实我一开始也不知道用啥 //console.log(e)我们可以打印一下 / ...
- js中鼠标滚轮事件详解
js中鼠标滚轮事件详解 (以下内容部分内容参考了http://adomas.org/javascript-mouse-wheel/ ) 之前js 仿Photoshop鼠标滚轮控制输入框取值中已使用 ...
- js整频滚动展示效果（函数节流鼠标滚轮事件）
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js中的鼠标滚轮事件
## 事件对象 event 1 event事件对象,表示用来获取事件的详细信息,比如得到鼠标的横坐标:事件对象.clientX(clientX是可视区坐标) window.onclick = func ...
随机推荐
- php中__clone() shallow copy 只是浅复制
什么是浅复制呢? 简单一点,就是说复制一个对象的时候,如果对象$Obj的一个属性的类型是引用类型的,比如 $person这个属性,指向的是一个 叫做 $objPerson的一个引用, 那么复制$Obj ...
- mysql 插入数据后返回当前的自增ID方法
存储过程的写法: mysql>create procedure test( ->in username varchar(50), ->in password varchar(50), ...
- Charles从入门到精通
Charles 从入门到精通 发表于 2015-11-14 12:00 文章目录 1. 目录 2. 简介 3. 安装 Charles 4. 将 Charles 设置成系统代理 5. Charles 主 ...
- JAVA基础--事务处理
事务处理: 1. 取消掉自动提交 set autocommmit=0 2. 开始事务 bigin 3. 进行一系列操作 update 4. 如果操作全部合格, 提交事务 commit 5. 如果发 ...
- ZOJ 3537 Cake
区间DP. 首先求凸包判断是否为凸多边形. 如果是凸多边形:假设现在要切割连续的一段点,最外面两个一定是要切一刀的,内部怎么切达到最优解就是求子区间最优解,因此可以区间DP. #include< ...
- NSString的几个方法（rangeOfString，hasPrefix，hasSuffix，改变大小写...）
- (NSRange)rangeOfString:(NSString *)searchString;//查找字符串中是包涵在某个字符串,并返回其开始位置和长度 例: NSRange range = [ ...
- TCP协议和UDP协议的区别
1. TCP协议面向连接. UDP协议面向非连接 (有无链接)2. TCP协议传输速度慢. UDP协议传输速度快 (传输速度)3. TCP协议保证数据顺序. UDP协议不保证 (数据的有序性. 在IP ...
- Android 中内容提供者的使用
在Android中内容提供者主要是用于不同程序之间的数据共享.内容提供器的用法一般有两种,一种是使用现有的内容提供器来读取和操作相应程序的数据,另一种是创建自己的内容提供器,供其他的程序访问. 使用现 ...
- 单片机联网,UIP实现tcp/udp协议
UIP是单片机界联网的一个很好地选择,移植这个库有点复杂,首先是第一步,网卡驱动要写好,使用的网卡芯片为ENC28J60,驱动可以再工程包里面找到 //配置网卡硬件,并设置MAC地址 //返回值:0, ...
- 安卓能用的modebus CRC16计算,附上对应的C语言的CRC16（转）
源:安卓能用的modebus CRC16计算,附上对应的C语言的CRC16 “源”即是原文地址,想了解作都更多文章及思想请移步到“源”.转过只是为了本人感兴趣的文章查找方便. 正文: 最近写安卓串口通 ...