jq(学习心得3)

最新推荐文章于 2023-07-05 23:37:25 发布

灰太狼吃羊羊

最新推荐文章于 2023-07-05 23:37:25 发布

阅读量108

点赞数

文章标签： java javascript 开发语言

本文链接：https://blog.csdn.net/m0_65474726/article/details/127378337

版权

本文将引导你学习如何运用基本筛选器进行数据处理，深入理解下拉框的实现原理，并通过JavaScript实现鼠标移动触发的动态元素位置调整，体验交互式体验。重点讲解onmousemove和onmouseup事件的应用。

摘要由CSDN通过智能技术生成

本节要点:

1.学会使用基本筛选器

2.学会动画的转换

3.学会下拉框与简化框

1.(基本选择器的类型作用)

下拉框的判断

添加鼠标在目标元素中移动事件 onmousemove
newMouseX=e.clientX
newMouseY=e.clientY
（鼠标移动的距离 X轴移动的距离就是我newMouseX-mouseX
鼠标移动的距离 Y轴移动的距离就是我newMouseY-mouseY）
disX=newMouseX-mouseX;
disY=newMouseY-mouseY;
现在已经计算好距离了下来只需要让我的盒子跟着动
newDivX=divX+disX;
newDivY=divY+disY;
box.style.left=newDivX+"px";
box.style.top=newDivY+"px";
定义弹起事件 onmouseup
当我们鼠标弹起的时候需要清空鼠标移动的事件
box.οnmοusemοve=null;