最近因为公司项目的要求,需要做页面的全屏滚动切换效果。

页面的切换,需要脚本监听鼠标滑轮的滚动事件,来判断页面是向上切换or向下切换.

这里的脚本很简单,我就直接贴出来吧。

 $('html').on('mousewheel DOMMouseScroll', function (e) {
e.preventDefault();
var t = new Date().getTime();
//防止鼠标滚动太快
if (t - Const.scrollTime < 1400) {
return !1;
}
Const.scrollTime = t; //鼠标滚轮的滚动方向 >0 up;<0 down
var _delta = parseInt(e.originalEvent.wheelDelta || -e.originalEvent.detail);
if (_delta > 0) {
//Scroll.up();
} else {
Scroll.down();
}
});

这里需要注意的一点就是e.originalEvent。

如果使用jQuery来进行事件绑定,在事件回调的参数中e是被jQuery重新封装的,所以我们必须使用e.originalEvent来指向原始的事件对象,就是这样任性。

js 判断鼠标滚轮方向的更多相关文章

  1. js/jq判断鼠标滚轮方向

    js判断鼠标滚轮方向: var scrollFunc = function (e) { e = e || window.event; if (e.wheelDelta) { //判断浏览器IE,谷歌滑 ...

  2. js中判断鼠标滚轮方向的方法

      前  言 LiuDaP 最近无聊,在做自己的个人站,其中用到了一个关于鼠标滚轮方向判断的方法,今天闲来无聊,就给大家介绍一下吧!!!! 在介绍鼠标事件案例前,让我们先稍微了解一下js中的event ...

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

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

  4. js 判断鼠标进去方向

    function fx(id){ var obj= document.getElementById(id); var fun=function(e){ var w=obj.offsetWidth; v ...

  5. JS判断鼠标从什么方向进入一个容器

    偶然将想到的一个如何判断鼠标从哪个方向进入一个容器的问题.首先想到的是给容器的四个边添加几个块,然后看鼠标进入的时候哪个块先监听到鼠标事件.不过这样麻烦太多了.google了一下找到了一个不错的解决方 ...

  6. JS如何判断鼠标滚轮向上还是向下滚动

    前几天偶然看到某前端群有人在问:JS如何判断鼠标滚轮向上还是向下滚动? 我想了想,有点蒙蔽,心想难道不是用scrollTop来判断吗? 但我不确定,也出于好奇心,于是开始了一番探索 思路:通过even ...

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

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

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

    分享一个js实现判断鼠标滚轮的上下滚动: <script type="text/javascript"> var scrollFunc = function (e) { ...

  9. JS判断鼠标向上滚动还是向下滚动

    js如何判断滚轮的上下滚动,我们应该都见到过这种效果,用鼠标滚轮实现某个表单内的数字向上滚动就增加,向下滚动就减少的操作,这种效果是通过js对鼠标滚轮的事件监听来实现的.今天简单的研究了一下如何使用j ...

随机推荐

  1. 【uoj261】 NOIP2016—天天爱跑步

    http://uoj.ac/problem/261 (题目链接) 题意 给出一棵树,给出一些起点和终点,没走一条路径耗费时间1,每个节点上有一个权值w,问有多少条路径经过这个节点时所用的时间恰好是w. ...

  2. 【poj1386】 Play on Words

    http://poj.org/problem?id=1386 (题目链接) 题意 给出n个单词,判断它们能否首尾相接的排列在一起. Solution 将每一格单词的首字母向它的尾字母连一条有向边,那么 ...

  3. Linq 101 工具和源码

    工具如图: 源码: https://git.oschina.net/yudaming/Linq101

  4. Lamp源码搭建

    Lamp Centos6.5 + Apache/2.2.29 + PHP 5.3.29 + Mysql5.6.20 Apache(/usr/local/apache) PHP(/usr/local/b ...

  5. POJ 1365 Prime Land(数论)

    题目链接: 传送门 Prime Land Time Limit: 1000MS     Memory Limit: 10000K Description Everybody in the Prime ...

  6. HTML之:fieldset——一个不常用的HTML标签

    2016年4月14日17:10:02记录 一个不常用的HTML标签fieldset,不过我觉得比较有意思,其语法如下: <fieldset><legend>fieldset名称 ...

  7. Mysql学习笔记(三)对表数据的增删改查。

    正文内容. 这一部分是最简单的,也是最麻烦的.简单是因为其实只包括增删该插四个部分.大体上看,增加数据.删除数据.修改数据.查询数据都不麻烦啊,我们日常都是常用的.这个谁不会呢?以前在培训机构学mys ...

  8. 我所了解的meta

    https://github.com/hoosin/mobile-web-favorites 总况 meta 标签分两大部分:HTTP 标题信息(http-equiv)和页面描述信息(name). h ...

  9. (翻译)如何对python dict 类型按键(keys)或值(values)排序

    如何对dict类型按键(keys)排序(Python 2.4 或更高版本): mydict = {'carl':40, 'alan':2, 'bob':1, 'danny':3} for key in ...

  10. 手写控件,frame,center和bounds属性

    一.手写控件 1.手写控件的步骤 (1)使用相应的控件类创建控件对象 (2)设置该控件的各种属性 (3)添加控件到视图中 (4)如果是button等控件,还需考虑控件的单击事件等 (5)注意:View ...