原理：
1、在页面中拖拽的原理：鼠标按下并且移动，之后松开鼠标
2、触发事件是鼠标按下mousedown、鼠标移动mousemove、鼠标松开mouseup
3、拖拽过程：鼠标移动过程中，获得最新的值赋值给box的left和top值
4、鼠标按下触发的事件源是最上面一行，就是id为title的标题
5、鼠标在页面中的坐标减去鼠标在盒子内的坐标就是盒子的真正位置
6、鼠标按下：获取鼠标在盒子中的坐标
7、鼠标移动：鼠标在页面中的坐标减去鼠标在盒子内的坐标赋值给box的left和top
8、鼠标松开：停止拖拽让鼠标移动事件解除
鼠标移动事件和鼠标抬起事件一定要写在鼠标按下事件中
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
#box{
width: 200px;
height: 200px;
background-color: #007BF9;
text-align: center;
color: #fff;
position: absolute;
left: 0;
top: 0;
}
#title{
height: 50px;
line-height: 50px;
}
</style>
</head>
<body>
<div id="box">
<div id=&#
最低0.47元/天 解锁文章
3320
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
