前端 —— JavaScript 基础篇 17 拖拽弹层-demo（三大系列的小demo）

前面文章提交了 offset 、client、 sroll 三大系列。今天来上个可以 拖拽的弹层 的小例子。方便自己复制粘贴

思路：拖拽弹层：
    鼠标点下(onmousedown):该事件内部要添加两个事件 ，移动事件 抬起事件(此事件内部含有移除移动事件)
        1、获取鼠标在元素内的坐标（pageX Y ,对象距离左边的距离offsetLeft，相减， 就是鼠标点在元素内的位置的坐标）
        2、鼠标移动弹层随移动(onmousemove), 始终获取对象距离左边和上边的坐标：需要获取pageX，pageY - 鼠标在元素内的位置
        3、鼠标抬起：停止移动(移除移动事件)

来看张图就明白了了，黄色的 x y坐标 在点下和移动时，在颜色块区域中的位置是不变的。

		
			登 录
		
		
			
			

				

					
				
				此弹层可以拖拽
			
		
		

来看js啊

 

如何给这个弹层设定界限呢，伙伴们，请留言哦！

我的文章都是学习过程中的总结，如果发现错误，欢迎留言指出，我及时更正。