js监控鼠标滚动事件
//滚动动画
windowAddMouseWheel();
function windowAddMouseWheel() {
var scrollFunc = function (e) {
e = e || window.event;
if (e.wheelDelta) { //判断浏览器IE,谷歌滑轮事件
if (e.wheelDelta > 0) { //当滑轮向上滚动时
$("#my_top").slideDown("slow");
$("#sl_last").slideUp("slow");
}
if (e.wheelDelta < 0) { //当滑轮向下滚动时
$("#my_top").slideUp("slow");
$("#sl_last").slideDown("slow");
}
} else if (e.detail) { //Firefox滑轮事件
if (e.detail> 0) { //当滑轮向上滚动时
$("#my_top").slideDown("slow");
$("#sl_last").slideUp("slow");
}
if (e.detail< 0) { //当滑轮向下滚动时
$("#my_top").slideUp("slow");
$("#sl_last").slideDown("slow");
}
}
};
//给页面绑定滑轮滚动事件
if (document.addEventListener) {
document.addEventListener('DOMMouseScroll', scrollFunc, false);
}
//滚动滑轮触发scrollFunc方法
window.onmousewheel = document.onmousewheel = scrollFunc;
}
参考大神写的,写博的时候网页关了,没找到原文地址,抱歉
js监控鼠标滚动事件的更多相关文章
- JS实现鼠标滚动事件,兼容IE9,FF,Chrome.
<!-- 废话不多说,直接贴代码 --><script type="text/javascript" src="jquery.min.js"& ...
- JS鼠标滚动事件
-----------------------------//鼠标滚动事件以下是JS临听鼠标滚动事件 并且还考虑到了各浏览器的兼容----------------------------------- ...
- js进阶 12-6 监听鼠标滚动事件和窗口改变事件怎么写
js进阶 12-6 监听鼠标滚动事件和窗口改变事件怎么写 一.总结 一句话总结:滚动事件scroll(),浏览器窗口调整监听resize(),思考好监听对象. 1.滚动事件scroll()的监听对象是 ...
- js中鼠标滚轮事件详解
js中鼠标滚轮事件详解 (以下内容部分内容参考了http://adomas.org/javascript-mouse-wheel/ ) 之前js 仿Photoshop鼠标滚轮控制输入框取值中已使用 ...
- js网页滚动条滚动事件实例分析
本文实例讲述了js网页滚动条滚动事件用法.分享给大家供大家参考.具体分析如下: 在做js返回顶部的效果时,要监听网页滚动条滚动事件,这个事件就是:window.onscroll.当onscroll事件 ...
- 在FireFox浏览器上,用stopImmediatePropagation阻止冒泡鼠标滚动事件
楔子 是不是在火狐用stopPropagation不太满意 很久没有笑过又不知为何 既然不快乐又不喜欢这里 不如一路向西用stopImmediatePropagation(其实我对浏览器的兼容性看不顺 ...
- vue组件添加鼠标滚动事件
在一个组件标签上加鼠标滚动事件,应该写成 @mousewheel.native
- 鼠标滚动事件 - onmousewheel
1.Jquery-MouseWheel jquery默认是不支持支持鼠标滚轮事件(mousewheel) jquery MouseWheel下载:https://github.com/jquery/j ...
- JavaScript一个鼠标滚动事件的实例
<script type="text/javascript" src="./whenReady.js"></script> <!- ...
随机推荐
- 【转载】Win10系统桌面右键新建没有Word、Excel、PPT怎么恢复?
Win10系统桌面右键新建没有Word.Excel.PPT怎么恢复? 以下正文转载至: 网址:http://www.xitongzhijia.net/xtjc/20170307/93471.html ...
- ASP.NET资源大全-知识分享 【转载】
API 框架 NancyFx:轻量.用于构建 HTTP 基础服务的非正式(low-ceremony)框架,基于.Net 及 Mono 平台.官网 ASP.NET WebAPI:快捷创建 HTTP 服务 ...
- python运行过程
程序执行过程 PyCodeObject:PyCodeObject则是Python编译器真正编译成的结果. 当python程序运行时,编译的结果则是保存在位于内存中的PyCodeObject中,当Pyt ...
- [转].NET 性能测试工具 -- 事件跟踪器(ETW)
.NET 性能测试工具 -- 事件跟踪器(ETW) 内容预告: Windows内置工具(性能计数器) 事件跟踪器(WPT,PerfMoniter,PerfView,自定义ETW) 时间分析 内存分配分 ...
- Django2.0资料
The Django Book 2.0 中文版:点击下载 Django课件和代码:点击下载
- Microsoft Azure News(7) Azure B系列虚拟机
<Windows Azure Platform 系列文章目录> 最近微软Azure新数据中心上线了B系列的虚拟机,我这边研究了一下,给大家分享. Azure B系列虚拟机,其实是Burst ...
- PAT 甲级 1005 Spell It Right (20 分)
1005 Spell It Right (20 分) Given a non-negative integer N, your task is to compute the sum of all th ...
- MongoDB复制集技术
复制集搭建 没毛病: https://www.cnblogs.com/nicolegxt/p/6841442.html?utm_source=itdadao&utm_medium=referr ...
- vue+窗格切换+田字+dicom显示_03
环境:vue+webpack+cornerstone ide:vs code 需求:窗格设置+拼图设置 代码: 主体:printPage.vue <div class="div mid ...
- 7-安装Spark
1.Apache Hadoop2.7中的YARN与JAVA8有冲突,如果想要使用spark on yarn,首先需要在yarn-site.xml中配置如下项: <property> < ...