鼠标左(右)滑也是网站开发中常见的效果之一,这里对鼠标左(右)滑做出一些解释。

首先要获取需要左右滑事件的节点:

eg:

var div=document.getElementById("div");

然后获取点击事件onmousedown并传参:

eg:

div.onmousedown=function(e){

}

在函数里写一个闭包来判断左右滑,这里需要获取鼠标的坐标,之后进行判断输出结果

eg:

div.onmousedown=function(e){

var a1=e.screenX;
       div.onmouseup=function (e){
      var a2=e.screenX;

if(a1>a2){console.log("左滑啊")}
      if(a1<a2){console.log("右滑啊")}
}

}

JS获取鼠标左(右)滑事件的更多相关文章

  1. 转---JS 获取鼠标左右键

    原文:http://blog.csdn.net/mine3333/article/details/7291557 function test() { alert(event.x+" &quo ...

  2. 原生js获取鼠标坐标方法全面讲解-zmq

    原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...

  3. JS中鼠标左右键以及中键的事件

    在三维场景中有时候需要判断鼠标的事件,除了使用的click事件,只有鼠标左键有效,而右键无效.而对于onmousedown.onmouseup的时候鼠标的事件左键/右键有效.详细请看w3c上的资料. ...

  4. js获取鼠标位置的各种方法

    在一些DOM操作中我们经常会跟元素的位置打交道,鼠标交互式一个经常用到的方面,令人失望的是不同的浏览器下会有不同的结果甚至是有的浏览器下没结果,这篇文章就上鼠标点击位置坐标获取做一些简单的总结,没特殊 ...

  5. JS获取鼠标位置,兼容IE FF

    由于Firefox和IE等浏览器之间对js解释的方式不一样,firefox下面获取鼠标位置不能够直接使用clientX来获取.网上说的一般都是触发mousemove事件才行.我这里有两段代码,思路都一 ...

  6. jquery处理鼠标左中右键事件

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 解决SlidingMenu和SwipeBackLayout右滑事件冲突问题

    SwipeBackLayout向右滑动关闭当前Activity,SlidingMenu向右滑动则是打开menu部分.在同一个Activity中,当SlidingMenu处于打开状态时,此时向右滑动,事 ...

  8. JS - 解决鼠标单击、双击事件冲突问题(原生js实现)

    由于鼠标双击时每一次触发双击事件都会引起两次单击事件和一次单击事件,原生的js不提供专门的双击事件. 因为业务原因,双击和单机都绑定了不同的业务,在双击的时候又触发了单机,影响了页面的正常显示 出现问 ...

  9. js获取鼠标坐标位置兼容多个浏览器

    这个是IE 11 下兼容下视图测试时可用. $(window).bind('beforeunload', function (event) { var _this = this; var x = ev ...

随机推荐

  1. js对象及元素复制拷贝

    1.数组及对象拷贝: 浅拷贝var b=$.extend(false,{},a);//对象浅拷贝 var a={aa:111,bb:{bb1:22}}; var b=$.extend(false,{} ...

  2. Vue 修改dist 目录.

    前后端分析之后,前端 打包处理 2

  3. 编译安装php5 解决编译安装的php加载不了gd

    1. 编译安装php需要的模块: yum install libxml2-devel libxml2  curl curl-devel  libpng-devel  libpng  openssl o ...

  4. C++多态,虚函数,虚函数表,纯虚函数

    1.多态性   指相同对象收到不同消息或不同对象收到相同消息时产生不同的实现动作. C++支持两种多态性:编译时多态性,运行时多态性.    a.编译时多态性:通过重载函数实现 ,模板(2次编译)  ...

  5. 关于openwrt使用web升级提示固件版本不对的处理方法

    参考资料:https://blog.csdn.net/caoshunxin01/article/details/79355602 当openwrt使用web升级提示固件版本不对: The upload ...

  6. 那些年,我们追过的PHP自加自减运算(2)

    ----------------------------------------------------------------------------------------- 先来一段例子,来引出 ...

  7. HTML+CSS基础课程

    慕课网上的课程 为了方便以后查阅 现做笔记如下 首先 了解下面的知识 1. HTML是网页内容的载体.内容就是网页制作者放在页面上想要让用户浏览的信息,可以包含文字.图片.视频等. 2. CSS样式是 ...

  8. MVC 2nd

    步骤 3 创建控制器. StudentController.java public class StudentController { private Student model; private S ...

  9. Monkey测试结果分析【转】

    转自[http://www.douban.com/note/257030241/] Monkey测试结果分析 一. 初步分析方法: Monkey测试出现错误后,一般的差错步骤为以下几步: 1. 找到是 ...

  10. win10虚拟桌面;一不小心按错了突然只剩下桌面,启动的程序都没了

    先说如何关闭虚拟桌面:ctrl+win+F4(万一你还没看到怎么关闭虚拟桌面,就创建并调整到虚拟桌面,会很懵的,因为你启动的所有程序全部都突然消失了,只剩下开机的桌面了): win10有个功能,虚拟桌 ...