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

页面的切换,需要脚本监听鼠标滑轮的滚动事件,来判断页面是向上切换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. VS中的代码段功能

    1.前言 开发人员不喜欢打字.如果你希望提高开发人员的生产力,减少键入的数量,这也同时减少打字稿的数量以及因此产生的编译器错误,这些都极大分散了开发人员的注意力.代码重用是开发人员收集代码的另一个原因 ...

  2. poj3484 Showstopper 二分

    题目地址 二分用的很是巧妙!关键是抽象出问题本质. #include <cstdio> #include <string> #include <cstring> ; ...

  3. Linux下pdf阅读器推荐

    由于需要在pdf文件上做标记,所以自带的文档查看器根本满足了需求,之前去网上查了查,Okular评价挺高,就安装了一个,确实能基本满足我的需求,但是 1.界面感觉还是不太友好,书签栏一直在那. 2.而 ...

  4. tmux/screen里面如何用鼠标滚轮来卷动窗口内容

    tmux里面用鼠标滚轮来卷动窗口内容 在 tmux里面,因为每个窗口(tmux window)的历史内容已经被tmux接管了,所以原来console/terminal提供的Shift+PgUp/PgD ...

  5. MOOCULUS微积分-2: 数列与级数学习笔记 4. Alternating series

    此课程(MOOCULUS-2 "Sequences and Series")由Ohio State University于2014年在Coursera平台讲授. PDF格式教材下载 ...

  6. CTO、技术总监、首席架构师的区别

    2016年11月30日13:22:26[转] CTO.技术总监.首席架构师的区别 提升自已的能力,比如专业技术,行业发展趋势,技术发展趋势,协调能力,组织能力,管理能力等[技术总监] 需要从技术总监和 ...

  7. ArrayList用法

    ArrayList属于collection->List接口下的一个集合类 针对数组的一些缺陷,集合框架提供了ArrayList集合类,对数组进行封装,实现了长度可变的数组,而且和数组彩用相同的存 ...

  8. Chrome控制台 JS调试的一些小技巧

    $ $_命令返回最近一次表达式执行的结果,功能跟按向上的方向键再回车是一样的,但它可以做为一个变量使用在你接下来的表达式中. $0~$4则代表了最近5个你选择过的DOM节点.在页面右击选择审查元素,然 ...

  9. 为什么springMVC和Mybatis逐渐流行起来了?

    http://www.zhihu.com/question/36032573 https://github.com/bingoohuang/eql

  10. 日志分析 第六章 安装elasticsearch

    在这里,以两台es集群为例. es集群健康状况有三种状态,这里我们搭建的es集群,只要两台不同时挂掉,数据不会丢失. green 所有主要分片和复制分片都可用 yellow 所有主要分片可用,但不是所 ...