JavaScript onmousewheel鼠标滚轮示例
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript onmousewheel鼠标滚轮示例</title>
<style>
#div1 { width:100px; height:100px; background-color:#}
</style>
<script>
window.onload = function(){
var oDiv = document.getElementById('div1');
oDiv.onmousewheel = fn; if(oDiv.addEventListener){
oDiv.addEventListener('DOMMouseScroll',fn,false);
}
function fn(ev){
var ev = ev || event;
var b = true;
if(ev.wheelDelta){
b = ev.wheelDelta > ? true : false;
}else{
b = ev.detail < ? true : false;
}
if(b){
if(this.offsetHeight < ){
this.style.height = this.offsetHeight + + 'px';
};
}else{
if(this.offsetHeight > ){
this.style.height = this.offsetHeight - + 'px';
}
}
if(ev.preventDefault){
ev.preventDefault();
}
return false;
}
}
</script>
</head>
<body>
<div id="div1"></div>
</body>
</html>
JavaScript onmousewheel鼠标滚轮示例的更多相关文章
- javaScript判断鼠标滚轮的上下滚动
分享一个js实现判断鼠标滚轮的上下滚动: <script type="text/javascript"> var scrollFunc = function (e) { ...
- JavaScript键盘鼠标事件处理
监听键盘鼠标事件 监听某个按键事件 当键盘上的某个键被按下时,会依次触发一次下面的事件: onkeydown: 键盘按下这个动作(按下键盘) onkeypress: 键盘被按住(一直按着键盘不动) o ...
- JavaScript中的鼠标滚轮事件详解
JavaScript中的鼠标滚轮事件详解/*Firefox注册事件*/ ~~~Firefox: addEventListener('DOMMouseScroll', handler, false)if ...
- HTML中鼠标滚轮事件onmousewheel处理
滚轮事件是不同浏览器会有一点点区别,一个像Firefox使用DOMMouseScroll ,ff也可以使用addEventListener方法绑定DomMouseScroll事件,其他的浏览器滚轮事件 ...
- javascript事件之鼠标滚轮(mousewheel)和DOMMouseScroll事件
javascript事件之鼠标滚轮(mousewheel)和DOMMouseScroll事件 发布时间:2015-02-07 编辑:www.jquerycn.cn 本文学习下,javascript ...
- 纯javaScript实现元素平滑滚动，改进前两个版本，支持鼠标滚轮滚动和点击元素滚动，滚动更顺畅
windowScroll(id, number, distance, direction, obj) 参数介绍: 1.id:所要滚动的元素id; 2.number:滚动次数; 3.distance:每 ...
- Javascript和jquery事件--鼠标滚轮事件WheelEvent
<1>js事件 滚轮事件在js中,不同浏览器还是有不同的,介于我只测试谷歌和火狐浏览器的情况,其他浏览器有待自行探索.有三种写法: target.onmousewheel = wheel; ...
- JavaScript判断鼠标滑轮是向下还是向上滚动
我们常用的就是鼠标,鼠标中键一般都用于滑动网页,但是网页中很多很炫的效果,使用鼠标滑轮操作更好. 当然对于手机就没有这个设备了,所以就不用考虑手机端的实现方法,手机端有触摸滑动事件. 使用JavaSc ...
- 鼠标滚轮事件MouseWheel
其实在大多数浏览器(IE6, IE7, IE8, Opera 10+, Safari 5+,Chrome)中,都提供了 "mousewheel" 事件.但杯具的是 Firefox ...
随机推荐
- FTP登录提示Can't open data connection for transfer of "/"
服务器: 系统:windows server 2008 R2 standard 是否开启防火墙:是 FTP客户端:Filezilla server 本地: FTP服务端:winscp 使用winscp ...
- 无备份mysql删除表后恢复
mysql从5.6.17开始自动设置innodb_file_per_table为on,每个表设置单独表空间,数据不是集中存放在ibdata1里.下面测试下无备份后drop表后的恢复. 前奏生成数据字典 ...
- python-面向对象之继承
一.继承介绍 继承是一种新建类的方式,新建的类称之为子类或者派生类,被继承的类称为父类/基类/超类 python中继承的特点: 1.子类可以遗传/重用父类的属性 2.子类可以有多个父类 3.Pytho ...
- 解决KafKa数据存储与顺序一致性保证
“严格的顺序消费”有多么困难 下面就从3个方面来分析一下,对于一个消息中间件来说,”严格的顺序消费”有多么困难,或者说不可能. 发送端 发送端不能异步发送,异步发送在发送失败的情况下,就没办法保证消息 ...
- Codeforces 848C Goodbye Souvenir [CDQ分治，二维数点]
洛谷 Codeforces 这题我写了四种做法-- 思路 不管做法怎样,思路都是一样的. 好吧,其实不一样,有细微的差别. 第一种 考虑位置\(x\)对区间\([l,r]\)有\(\pm x\)的贡献 ...
- 高性能MySQL（第3版） 中文PDF带目录清晰版
下载地址: <高性能MySQL(第3版)>编辑推荐:"只要你不敢以MySQL专家自诩,又岂敢错过这本神书?""一言以蔽之,写得好,编排得好,需要参考时容易到爆 ...
- npm安装依赖包 --save-dev 和 --save; package.json的devDependencies和dependencies 的区别！
以前一直在纠结一个npm安装的包依赖管理的问题.是这样的: 我们在使用npm install 安装模块或插件的时候,有两种命令把他们写入到 package.json 文件里面去,他们是:--save- ...
- Layers Of Caffe
本文试图描述构建一个网络结构的layers,可以用prototxt脚本直接写,也可以用python接口实现. 最简单的神经网络包含但不限于以下四部分: 数据层(Data): Data.ImageDat ...
- MySQL 复制表到另一个表
1.复制表结构及数据到新表 create table 新表 select * from 旧表 2.只复制表结构到新表 方法1:(低版本的mysql不支持,mysql4.0.25 不支持,mysql5已 ...
- H5实现轮播
页面代码: <div id="body_wrapper" class="container"> <article> <sectio ...