网站需要实现鼠标滚轮滚一下,页面向下滑向下一个锚点,由于前面有个一样式必须用jQuery1.3.2,而好多滚轮事件都使用了更高版本的jQuery,于是就从网上找了找

<script type="text/javascript">
var sel_index = -1
var sel_max = $(".billboard-hero").length - 1;
function handle(delta) {
var s = delta + ": ";
if (delta < 0) {
sel_index++;
s += "您在向下滚……";
s += sel_index;
if (sel_index >= sel_max) sel_index = sel_max;
}
else {
sel_index--;
s += "您在向上滚……";
s += sel_index;
if (sel_index <= -1) sel_index = -1;
}
location.href = "#" + $(".billboard-hero")[sel_index].id;
}
function wheel(event) {
var delta = 0;
if (!event) event = window.event;
if (event.wheelDelta) {
delta = event.wheelDelta / 120;
if (window.opera) delta = -delta;
} else if (event.detail) {
delta = -event.detail / 3;
}
if (delta)
handle(delta);
} window.addEventListener ? window.addEventListener("DOMMouseScroll", this.wheel, false) : null; document.onmousewheel = this.wheel;
</script>

其实和网上的差不多,主要是发现在Chrome和360急速模式下鼠标滚轮滚一下,会触发两次,所以需要

window.addEventListener ? window.addEventListener("DOMMouseScroll", this.wheel, false) : null;

不过本人水平有限,不明其中觉厉...

使用JS实现鼠标滚轮事件的更多相关文章

  1. js中鼠标滚轮事件详解

    js中鼠标滚轮事件详解   (以下内容部分内容参考了http://adomas.org/javascript-mouse-wheel/ ) 之前js 仿Photoshop鼠标滚轮控制输入框取值中已使用 ...

  2. js整频滚动展示效果(函数节流鼠标滚轮事件)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. JS鼠标滚轮事件解析

    一.不同浏览器的鼠标滚轮事件 首先,不同的浏览器有不同的滚轮事件.主要是有两种,onmousewheel(IE/Opera/Chrome支持,firefox不支持)和DOMMouseScroll(只有 ...

  4. js鼠标滚轮事件

    不多说,直接上代码. //非ie document.body.onmousewheel = function(event) { event = event || window.event; conso ...

  5. JS鼠标滚轮事件详解

    鼠标滚轮事件 //兼容性写法,该函数也是网上别人写的,不过找不到出处了,蛮好的,所有我也没有必要修改了 //判断鼠标滚轮滚动方向 if (window.addEventListener)//FF,火狐 ...

  6. js鼠标滚轮事件兼容

    JavaScript鼠标滚轮事件 IE6.0首先实现了鼠标的滚轮事件,其良好的交互效果得到认可,随后Opera.chrome.safari等主流浏览器都实现了该效果,不过存在着很大的兼容问题. 大多数 ...

  7. js中的鼠标滚轮事件

    ## 事件对象 event 1 event事件对象,表示用来获取事件的详细信息,比如得到鼠标的横坐标:事件对象.clientX(clientX是可视区坐标) window.onclick = func ...

  8. JS 判断鼠标滚轮的上下滚动

    JS 判断鼠标滚轮的上下滚动   <script type="text/javascript"> var scrollFunc = function (e) { e = ...

  9. VC 鼠标滚轮事件控制绘图的问题

    问题描述: 在MFC中绘制数据曲线,通过鼠标滚轮来进行放大缩小操作.在使用滚轮事件时,发现如果数据量较大,会出现卡顿. 解决方案: 鼠标滚轮事件会进行重复绘图,考虑在鼠标滚轮结束之后再重绘: 在鼠标滚 ...

随机推荐

  1. tomcat配置多个web网站的配置详解

    假如只有一台服务器,需要配置多个web网站(端口不同我还没试),该怎么样配置tomcat呢,其实很简单,只需要将tomcat 下面的 server.xml  中增加两个甚至是多个<Host> ...

  2. uva 1422 - Processor(二分+优先队列)

    题目链接:uva 1422 - Processor 题目大意:有一个机器要处理一些问题,给出这些问题可以开始的时间和必须完成的时间,以及任务的工作量,问说机器必须以最少每秒多少得工作量才能完成这些任务 ...

  3. 传值(VIP)

    页面间传值主要分为:1.属性传值.2.协议传值.3.单例传值.4.Block传值:   界面之间的传值:   1.从前往后:属性传值 2.从后往前:代理传值   3.多界面之间的传值 — 单例传值   ...

  4. windows API 实现截图

    參考:http://bbs.csdn.net/topics/330154355 #include "stdio.h" #include "windows.h" ...

  5. 【剑指Offer学习】【面试题19 :二叉树的镜像】

    题目:请完毕一个函数,输入一个二叉树,该函数输出它的镜像. 二叉树结点的定义: /** * 二叉树的树结点 */ public static class BinaryTreeNode { int va ...

  6. jqgrid表格列动态加载的实现

    选中几个测点名,在表格中就显示几列. 具体代码如下: function reloadGrid(postData){ $('#gridTable').jqGrid('GridUnload'); var ...

  7. C# - 系统类 - String类

    String类 ns:System String类封装了一系列不能被改变的Unicode字符序列 字符属于引用类型 但它又具有值类型的行为 固定不变意味着 一旦在托管堆中分配了一块内存来存储字符 字符 ...

  8. Android主题换肤 无缝切换

    2016年7月6日 更新:主题换肤库子项目地址:ThemeSkinning,让app集成换肤更加容易.欢迎star以及使用,提供改进意见. 更新日志: v1.3.0:增加一键切换切换字体(初版)v1. ...

  9. 使用DrawerLayout实现侧拉菜单

    侧拉菜单在android应用中非常常见,它的实现方式太多了,今天我们就说说使用Google提供的DrawerLayout来实现侧拉菜单效果,先来看张效果图: DrawerLayout的实现其实非常简单 ...

  10. MVC1笔记

    /// ///直接返回 字符串的 Action方法,适用于 不需要返回大量 html代码的业务(类似于一般处理程序) /// public string Index() { return " ...