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

页面的切换,需要脚本监听鼠标滑轮的滚动事件,来判断页面是向上切换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. GitHub Pages和每个项目绑定自定义域名(支持多个和顶级域名)

    假设我购买的域名为www.easonjim.com,想把www.easonjim.com和easonjim.com的域名跳转到下面的网址easonjim.github.io. 而我在github上的账 ...

  2. python时间模块-time和datetime

    时间模块 python 中时间表示方法有:时间戳,即从1975年1月1日00:00:00到现在的秒数:格式化后的时间字符串:时间struct_time 元组. struct_time元组中元素主要包括 ...

  3. Algorithmic Graph Drawing in TikZ

    最近在写模板时需要画个图 ("图论"的"图"). 本来打算用Windows画图 (mspaint) 的, 但是效果不好, 还是决定用LaTeX的TikZ画. 这 ...

  4. Linux下安装webstorm

    Linux下安装webstorm 1--在webstorm官网里面下载最新的版本 WebStorm-11.0.3.tar.gz 2--创建webstorm的安装目录 #mkdir /usr/webst ...

  5. Linux之:Ubuntu速学笔记(2)

    撰写日期:2016-7-3 18:20:39 基本内容包括:Flash player安装.编译安装PHP.写个简单的PHP程序:Java程序(Java需要使用“javac”命令编译一下才能执行) 一. ...

  6. JavaScript 的错误(Error)与异常(Exception)处理

    PHP很少用到错误处理,因为框架帮了大忙,所以基本上没有主动接手过PHP的错误.PHP是偏后端的动态处理语言,和用户的关系不大,所以用户不会关心是否出现了报错.但是JavaScript就非常不同了,j ...

  7. HD1556Color the ball(树状数组)

    Color the ball Time Limit: 9000/3000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)To ...

  8. awk过滤数据

    awk -F ',' '{if($2 ~/\./ ) {print $1,$2 }}' 20160905_names > ttt1 awk -F ',' '{if($2 !~/[0-9]+\.[ ...

  9. 使用ASP.NET Web Api构建基于REST风格的服务实战系列教程【三】——Web Api入门

    系列导航地址http://www.cnblogs.com/fzrain/p/3490137.html 前言 经过前2节的介绍,我们已经把数据访问层搭建好了,从本章开始就是Web Api部分了.在正式开 ...

  10. CodeForces 710CMagic Odd Square(经典-奇数个奇数&偶数个偶数)

    题目链接:http://codeforces.com/problemset/problem/710/C 题目大意:输入一个奇数n,则生成n*n矩阵,要求矩阵的行.列还有斜着,所有元素之和为奇数. 解题 ...