js实现div的拖拽回复eqyun问题

乞儿不再叫江

于 2011-09-06 21:33:59 发布

阅读量134

点赞数

文章标签： div function ie 文档优化测试

本文链接：https://blog.csdn.net/qierjiang/article/details/6754840

版权

本文介绍了一种优化后的JavaScript代码实现div元素的拖拽功能，同时关注了在IE浏览器中可能遇到的问题。代码经过测试，但在特定情况下重新获取焦点时可能会存在问题，期待进一步的解决方案。

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

这里是从别人代码里优化出来的，注释是自己注释的，有解释或理解错误的地方希望给予更正...//经测试，在从新获得焦点上没做处理，有时会出现问题

<!DOCTYPE>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<!--这里的utf-8为什么不行？-->
<title>拖拽效果</title>
<style type="text/css">
body {  font-family:Verfana;
	font-size:11px;
	color:#333333;
	}
#win {
	position:absolute;
	left:0px;
	top:0px;
	width:200px;
	height:150px;
	border:1px solid #000000;
	background:yellow;
	}
</style>
	<script type="text/javascript">
		var win;
		var left = 0;//最好和win的位置保持一致
		var top = 0;
		var move = false;
	window.onload = init;//
	function init() {
			win = document.getElementById("win");//返回id=win的对象
			win.onmousedown = startDrag;
			win.onmousemove = drag;
			win.onmouseup = stopDrag;
	}
	
	function startDrag(event) { //当有鼠标