JS Web API 拖拽对话框案例

2021-06-01 04:04

阅读：555

标签：fun log one 坐标 NPU ade BMI alpha relative

思路：
1、当鼠标按下时，求出鼠标在盒子中的位置；
鼠标在盒子中的位置 = 鼠标在页面中的位置 - 盒子在页面中的位置

2、当鼠标移动时，保持鼠标在盒子中的位置不变（即盒子跟随鼠标移动）
盒子的坐标 = 鼠标当前在页面中的位置 - 鼠标在盒子中的位置

使用到的属性有：offsetLeft、offsetTop、pageX、pageY
注意：盒子要脱离文档流，即设置 position：absolute

====================问题解决l====================
问题：鼠标弹起了，盒子还黏在鼠标上。
解决：当鼠标弹起时，移除鼠标移动事件。
关闭按钮：当鼠标点击关闭按钮时，隐藏盒子
注意：使用getPage(e)解决pageX和pageY的浏览器兼容性问题

JS Web API 拖拽对话框案例

标签：fun log one 坐标 NPU ade BMI alpha relative

原文地址：https://www.cnblogs.com/liout/p/10992440.html

文章来自：搜素材网的编程语言模块，转载请注明文章出处。
文章标题：JS Web API 拖拽对话框案例
文章链接：http://soscw.com/index.php/essay/89882.html

亲，登录后才可以留言！