JS拖动技术--- 关于setCapture (转自 剑胆琴心-.Net学习笔记)
<script type="text/javascript">
<!--
window.οnlοad=function(){
objDiv = document.getElementById('drag');
drag(objDiv);
};
function drag(dv){
dv.οnmοusedοwn=function(e){
var d=document;
e = e || window.event;
var x= e.layerX || e.offsetX;
var y= e.layerY || e.offsetY;
//设置捕获范围
if(dv.setCapture){
dv.setCapture();
}else if(window.captureEvents){
window.captureEvents(Event.MOUSEMOVE | Event.MOUSEUP);
}
d.οnmοusemοve=function(e){
e= e || window.event;
if(!e.pageX)e.pageX=e.clientX;
if(!e.pageY)e.pageY=e.clientY;
var tx=e.pageX-x;
var ty=e.pageY-y;
dv.style.left=tx;
dv.style.top=ty;
};
d.οnmοuseup=function(){
//取消捕获范围
if(dv.releaseCapture){
dv.releaseCapture();
}else if(window.captureEvents){
window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);
}
//清除事件
d.οnmοusemοve=null;
d.οnmοuseup=null;
};
};
}
//-->
</script>
<div id="drag" style="position:absolute;left:12px;top:24px;width:100;height:150;border:1px solid #000000;z-index:1;background:#eeeeee">drag me</div>
--------------------------------------
setCapture 的意思就是设置一个对象的方法被触发的范围,或者作用域。
如果不设置,则div只在当前窗口内被触发。如果设置,则在整个浏览器范围内被触发,也就是可以拖到浏览器外面
转载于:https://www.cnblogs.com/Godblessyou/archive/2008/05/14/1196746.html
JS拖动技术--- 关于setCapture (转自 剑胆琴心-.Net学习笔记)相关推荐
- webpack:js、css、es6装载与压缩配置-学习笔记
文章目录 webpack:js.css.es6装载与压缩配置-学习笔记 css文件打包 loader执行顺序 loader与plugin区别 less css抽取 js,css压缩处理 依赖包降级处理 ...
- js粘贴板为什么获取不到图片信息_JavaScript 学习笔记(3):图片库
本文使用 Zhihu On VSCode 创作并发布 1. 为什么要使用图片库 可以把所有的图片都放到一个网页里,不过当图片过多时,会导致网页体积过大. 因此,为每张图片分别创建一个网页的解决方案. ...
- JS进阶 Day1 作用域 函数进阶 结构赋值(学习笔记)
1.作用域 1)局部作用域 函数作用域 注:函数执行完毕后,函数内部的变量实际被清空了 块级作用域 在js中使用{}包裹的代码称为代码块,代码块内部声明的变量外部将{有可能}无法访问 let声明的变量 ...
- 【华为云技术分享】物体检测yolo3算法 学习笔记(1)
[摘要] YOLO作为一个one-stage目标检测算法,在速度和准确度上都有杰出的表现.而YOLO v3是YOLO的第3个版本(即YOLO.YOLO 9000.YOLO v3),检测效果,更准更强. ...
- 【华为云技术分享】物体检测yolo3算法 学习笔记2
先来看一下yolo3的结构图: 1.主体网络darknet53 最左边的这一部分叫做Darknet-53, (1)它最重要特点是使用了残差网络Residual,darknet53中的残差卷积就是进行一 ...
- 【技术管理】管理核心五要素 - 学习笔记
可以把管理看作是:一位马车夫驾驶着一辆多匹马拉的马车赶往目的地.这个比喻体现了两大要素:带人和做事,只不过这里的"人"是一群拉车的马,而"事"就是驾驶马车. 如 ...
- 传感器技术—气敏电阻式传感器(学习笔记四)
气敏电阻式传感器 3.3.1 气敏电阻式传感器的工作原理 3.3.2 气敏电阻式传感器的结构和分类 1.按结构分 2.按加热方式分 3.3.3 气敏电阻式传感器的应用与检测 1.简易家用气体报警器 2 ...
- 【技术管理】团队建设六要素 - 学习笔记
作为一个管理者,如何群策群力打胜仗? "群策群力"就是如何带好团队(带人),"打胜仗"就是如何取得好的业绩(做事). 那么,究竟怎么带好团队呢?带团队需要从哪几 ...
- 《尚硅谷高级技术之JUC高并发编程》学习笔记11—— Fork / Join 框架
文章目录 Fork / Join 框架简介 fork() 方法 join() 方法 Fork / Join 框架的异常处理 入门案例 总结 Fork / Join 框架简介 Fork / Join 它 ...
- java jdk 8学习笔记,Java JDK 8学习笔记 PDF_源雷技术空间
资源名称:Java JDK 8学习笔记 PDF 内容简介: ●本书是作者多年来教学实践经验的总结,汇集了学员在学习课程或认证考试中遇到的概念.操作.应用等问题及解决方案 ●针对Java SE 8新功能 ...
最新文章
- matlab ga rbf,GA PSO优化的RBF神经网络
- 利用jQuery对无序列表排序 http://www.apkbus.com/android-80639-1-1.html
- Part8 多态性 8.2虚函数
- javascript中判断对象是否为空几种场景
- 大二暑假周进度报告(五)
- [Java基础]字符流读写数据的方式
- H264编码 封装成MP4格式 视频流 RTP封包
- excel怎么添加diy工具箱_这些Excel插件让你的Excel更好用!
- FreeRTOS学习及移植笔记之一:开始FreeRTOS之旅
- 关于LUA+Unity开发_XLua篇
- 初识 NGINX 服务网格
- dedecms网站轮播本地显示为什么上传到服务器就不显示了,dedecms后台上传图片实现图片轮播的方法...
- fenby C语言 P17
- 使用Nssm部署Exe程序为服务
- Jmeter 接口测试post请求数据失败
- 多个同1div float left换行题
- 基于SSM第一医院病案管理系统
- 基于Qemu虚拟vexpress-a9开发板,实现完整系统启动(uboot+kernel+rootfs)
- React脚手架搭建项目
- grasshopper elk插件_Grasshopper常用插件汇总