js监听鼠标拖动事件(按住左键拖动触发，松开左键取消)

此段代码，实现了左键点击id元素内区域后，拖动鼠标到边缘区域滚动条(内部class元素的滚动条)自动滚动，松开鼠标后取消事件

业务需要记录一下

$(function () {var div=document.getElementById("元素id");div.onmousedown=function(e){document.onmousemove=function(e){var xx=e.clientX || e.clientx ||0;var yy=e.clientY || e.clienty ||0;//首先获得鼠标位置坐标var T1=yy;var L1=xx;//然后设置该两个差值的筏值 T1max T1min L1max L1min；//.content为元素id下的子元素，实际想监听这个class,由于js监听id比较方便，改为了监听带id的父元素var T1max= $(".content").height()*0.95;var T1min= $(".content").height()*0.5;var L1max= $(".content").width()*0.95;var L1min= $(".content").width()*0.3;//当T1 大于 T1max 或者小于 T1min 时，触发滚动条动作，变化速度为 T1 与 筏值的差值(每秒) [滑动效果另议]if(T1>T1max) $(".content").scrollTop( $(".content").scrollTop()+T1-T1max);if(T1<T1min) $(".content").scrollTop( $(".content").scrollTop()+T1-T1min);//同上，处理L1if(L1>L1max) $(".content").scrollLeft( $(".content").scrollLeft()+L1-L1max);if(L1<L1min) $(".content").scrollLeft( $(".content").scrollLeft()+L1-L1min);};document.onmouseup=function(){document.onmouseup=null;document.onmousemove=null;};};});

js监听鼠标拖动事件(按住左键拖动触发，松开左键取消)相关推荐

JS监听鼠标滑轮事件
上才艺 var box = document.getElementById('box');function onMouseWheel(ev) {var ev = ev || window.event; ...
js监听鼠标滚轮事件
兼容写法:/Chrome/IE/Opera window.onmousewheel=document.onmousewheel=(e)=>{if(e.wheelDelta<0){conso ...
js监听多个事件_JavaScript中的事件与异常捕获解析
这篇文章主要给大家介绍了关于JavaScript中事件与异常捕获的相关资料,文中通过示例代码介绍的非常详细,写的十分的全面细致,具有一定的参考价值,对此有需要的朋友可以参考学习下.如有不足之处,欢迎批 ...
python pyhook监听扫码_Python——pyHook监听鼠标键盘事件
pyHook包为Windows中的全局鼠标和键盘事件提供回调. 底层C库报告的信息包括事件的时间,事件发生的窗口名称,事件的值,任何键盘修饰符等. 而正常工作需要pythoncom等操作系统的API的 ...
css 鼠标滚动事件,js监听鼠标的滚轮滚动事件教程
不同的有不同的滚轮事件.主要是有两种,onmousewheel(firefox不支持)和dommousescroll(只有firefox支持),关于这两个事件这里不做详述,想要了解的朋友请移步:鼠标滚 ...
html鼠标滚轮监听,javascript监听鼠标滚轮事件浅析
我们都见到过这些效果,用鼠标滚轮实现某个表单内的数字增加减少操作,或者滚轮控制某个按钮的左右,上下滚动.这些都是通过js对鼠标滚轮的事件监听来实现的.今天这里介绍的是一点简单的js对于鼠标滚轮事件的监 ...
Java怎么监听鼠标滑轮的转向_javascript监听鼠标滚轮事件浅析
我们都见到过这些效果,用鼠标滚轮实现某个表单内的数字增加减少操作,或者滚轮控制某个按钮的左右,上下滚动.这些都是通过js对鼠标滚轮的事件监听来实现的.今天这里介绍的是一点简单的js对于鼠标滚轮事件的监 ...
js监听浏览器关闭事件(区分刷新和关闭,兼容IE9,10,11,Edge，Chrome和Firefox)
由于各浏览器兼容性不同,所以首先要先区分各浏览器 var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 var isOpera = use ...
监听鼠标滚动条事件
window.addEventListener("scroll", this.handleScroll, true); //监听滚动事件handleScroll() {const ...

js监听鼠标拖动事件(按住左键拖动触发，松开左键取消)

js监听鼠标拖动事件(按住左键拖动触发，松开左键取消)相关推荐

最新文章

热门文章