<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>鼠标拖动层</title>
</head>
<body>
<div id="floatLayer" style="position:absolute;width:200px;height:200px;background:black;"></div>
<script type="text/javascript">
function Drag(id) {
var obj = document.getElementById(id);
//设置初始值
var flag = 0;
var minus_x = 0;
var minus_y = 0;
obj.onmousedown = function(e){
var evt = e || window.event;
if (document.setCapture) this.setCapture();
if (window.captureEvents) window.captureEvents(Event.MOUSEMOVE | Event.MOUSEUP);
flag = 1;
this.style.cursor = 'move';
minus_x = evt.clientX - obj.offsetLeft;
minus_y = evt.clientY - obj.offsetTop;
}
document.onmousemove = function(e){
var evt = e || window.event;
if(flag) {
obj.style.left = parseInt(evt.clientX - minus_x) + 'px';
obj.style.top = parseInt(evt.clientY - minus_y) + 'px';
}else{
return null;
}
}
obj.onmouseup = function(){
if (document.releaseCapture) this.releaseCapture();
if (window.releaseEvents) window.releaseEvents(Event.MOUSEMOVE | Event.MOUSEUP);
flag = 0;
}
}
Drag('floatLayer');
</script>
</body>
</html>
以上代码在FF IE8 360极速下测试通过。
2153
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
