js判断鼠标滚动方向

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title></title>
    <script type="text/javascript">
        var scrollFunc = function (e) {
        e = e || window.event;
        if (e.wheelDelta) {  //判断浏览器IE,谷歌滑轮事件
            if (e.wheelDelta > 0) { //当滑轮向上滚动时
                console.log("滑轮向上滚动");
            }
            if (e.wheelDelta < 0) { //当滑轮向下滚动时
                console.log("滑轮向下滚动");
            }
        } else if (e.detail) {  //Firefox滑轮事件
            if (e.detail> 0) { //当滑轮向上滚动时
                console.log("滑轮向上滚动");
            }
            if (e.detail< 0) { //当滑轮向下滚动时
                console.log("滑轮向下滚动");
            }
        }
    }
    //给页面绑定滑轮滚动事件
    if (document.addEventListener) {//firefox
        document.addEventListener(‘DOMMouseScroll‘, scrollFunc, false);
    }
    //滚动滑轮触发scrollFunc方法  //ie 谷歌
    window.onmousewheel = document.onmousewheel = scrollFunc;
    </script>
</head>
<body>
    <div style="height:2000px;width:200px;background:#333;"></div>
</body>
</html>
时间: 2024-10-02 20:53:38

js判断鼠标滚动方向的相关文章

js 判断鼠标滚轮方向

最近因为公司项目的要求,需要做页面的全屏滚动切换效果. 页面的切换,需要脚本监听鼠标滑轮的滚动事件,来判断页面是向上切换or向下切换. 这里的脚本很简单,我就直接贴出来吧. 1 $('html').on('mousewheel DOMMouseScroll', function (e) { 2 e.preventDefault(); 3 var t = new Date().getTime(); 4 //防止鼠标滚动太快 5 if (t - Const.scrollTime < 1400) {

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

  前  言 LiuDaP 最近无聊,在做自己的个人站,其中用到了一个关于鼠标滚轮方向判断的方法,今天闲来无聊,就给大家介绍一下吧!!!! 在介绍鼠标事件案例前,让我们先稍微了解一下js中的event对象 一.JS中的Event对象 Event对象:它代表的是事件的状态,例如可以表示鼠标的位置.鼠标按钮的状态.键盘按键的状态等等. >>>事件通常与函数结合使用,函数不会在事件发生前被执行! 二.JS中如何判断鼠标滚轮方向 判断鼠标滚轮的方向,有着两个派别:一是谷歌.IE派别(这次IE没有

JS判断鼠标移入元素的方向

最终效果 这里的关键主要是判断鼠标是从哪个方向进入和离开的 $("li").on("mouseenter mouseleave",function(e) { var w = this.offsetWidth; var h = this.offsetHeight; var x = e.pageX - this.getBoundingClientRect().left - w/2; var y = e.pageY - this.getBoundingClientRect

mousewheel,DOMMouseScroll判断滚轮滚动方向

firefox使用DOMMouseScroll,其他浏览器使用mousewheel 首先绑定一个滚动事件 //firefox使用DOMMouseScroll,其他浏览器使用mousewheel$(document).bind('mousewheel DOMMouseScroll',mouseScroll); 当滚动时获取wheelDelta值,firefox使用detail:值为下滚3上滚-3,其他浏览器使用wheelDelta:值为下滚-120上滚120,通过判断其值为正或者负即可判断鼠标滚轮

mac鼠标滚动方向自然问题

mac使用鼠标的时候滚轮方向和Windows是相反的.假设不勾选滚动方向自然,那么触摸板使用不爽. 解决的方法: 1.打开http://pilotmoon.com/scrollreverser/,下载Scroll Reverser. 2.将该软件拖动到 应用程序 中. 3.双击打开时候须要在 系统偏好设置 | 安全性与隐私 中,改动同意从 不论什么来源 下载应用程序. 4.Preferences 里面勾上 start at login 和 reverse mouse . 參考: http://w

js判断鼠标是否停止移动

本程序实现当鼠标在一个特定的div内悬停n秒时,判断出已经停止移动. 思路: 1.定义全局变量鼠标移动状态imouse,定时器timer.当鼠标在div内移动时,imouse值为1,相反静止时值为0:timer可以实现每过n秒就判断鼠标状态,然后把imouse重置为0: 2.div监听onmouseover.当鼠标进入区域时,就设置定时器: 3.div监听onmousemove.当鼠标移动时,设置imouse值为1: 4.div监听onmouseout.当鼠标离开时,清除定时器timer <ht

js判断鼠标位置是否在某个div中

div的onmouseout事件让div消失时,会出现这样的情况,就是当鼠标移至div中的其它内容时,此时也判定为离开div,会触发 onmouseout事件,这样div中的内容就不能操作了.解决的办法是当触发onmouseout事件时,先判断鼠标是否在div内,如果在,说明鼠 标并没有离开div,就不删除div,否则,删除之.OK,现在问题解决了. 就是找到该div左上角和右下角坐标,判断鼠标的坐标是否在这一区域就可以了. [javascript] view plaincopyprint? d

js禁用鼠标滚动wheel/DomMouseScroll

function scrollFunc(evt) {  evt = evt || window.event;    if(evt.preventDefault) {    // Firefox      evt.preventDefault();      evt.stopPropagation();    } else {      // IE      evt.cancelBubble=true;      evt.returnValue = false;  }  return false;

关于js判断鼠标移入元素的方向——上下左右

一开始我是这么想的,将待移入的元素分割四块,用mousemove获取第一次鼠标落入的区域来判断鼠标是从哪个方向进去的. 所以只要写个算法来判断鼠标的值落入该元素的区域就可以得出鼠标移入的方向,如下图: 对于数学不太好的我,只能上网找下看有没有人解决了.找到了如下这段: var x = (e.pageX - this.offsetLeft - (w / 2)) * (w > h ? (h / w) : 1); var y = (e.pageY - this.offsetTop - (h / 2))