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 ...
随机推荐
- 51nod--1256 乘法逆元 (扩展欧几里得)
题目: 1256 乘法逆元 基准时间限制:1 秒 空间限制:131072 KB 分值: 0 难度:基础题 收藏 关注 给出2个数M和N(M < N),且M与N互质,找出一个数K满足0 < ...
- 文本内容查找grep、文件查找find、正则匹配
一.文本内容查找工具 grep grep egrep (文本过滤) fgrep (不支持正则) 对文本的内容按照指定的匹配模式基于行来进行筛选 格式 grep [选项] 模式 文件 选 ...
- 浅谈深度优先和广度优先(scrapy-redis)
首先先谈谈深度优先和广度优先的定义 深度优先搜索算法(英语:Depth-First-Search,DFS)是一种用于遍历或搜索树或图的算法.沿着树的深度遍历树的节点,尽可能深的搜索树的分支.当节点v的 ...
- 洛谷P4389 付公主的背包 [生成函数,NTT]
传送门 同样是回过头来发现不会做了,要加深一下记忆. 思路 只要听说过生成函数的人相信第一眼都可以想到生成函数. 所以我们要求 \[ ans=\prod \sum_n x^{nV}=\prod \fr ...
- Go 开源博客平台 Pipe 1.0.0 发布!
这是 Pipe 博客平台的第一个正式版,欢迎大家使用和反馈建议! 简介 Pipe 是一款小而美的开源博客平台,通过黑客派账号登录即可使用. 动机 产品层面: 市面上缺乏支持多独立博客的平台级系统 实现 ...
- Confluence 6 注册单一小工具
如果你不能订阅一个应用的小工具,你需要将小工具一个一个的添加进来.针对网站不支持小工具订阅和你的应用和你的 Confluence 不能建立信任连接的情况,你就只能这样添加了. 首先你需要获得小工具的 ...
- 将Maven项目打包成可执行jar文件(引用第三方jar)
方法一. mvn assembly 或 mvn package (一个jar包) 把依赖包和自己项目的文件打包如同一个jar包(这种方式对spring的项目不支持) <build> ...
- 断路器Feign
Feign是自带断路器,需要在配置文件中开启断路器 改造消费者项目(FeignDemo) 1.在application.yml配置文件中开启断路器 eureka: client: service-ur ...
- 【mongo】centos6.9安装mongo2.6.3
参考:http://www.haorooms.com/post/3m 注意:centos6上就不要装mongo3了,容易出错. 1. 下载 curl -O http://downloads.mongo ...
- solt插槽简单使用实例
在父组件内可以定义方法,变量 等,还可以在父组件中使用呢. 样式可以在子组件里写,也可以在父组件写. 子组件: <template> <div class="admin-u ...