鼠标拖动div标签,动态改变位置
简单来说就是鼠标拖着div在屏幕上走,当然也适用于其他的标签。没什么可说的,比较简单,直接上代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>div_mousemove</title>
</head>
<style type="text/css">
#map{
width: 200px;
height: 200px;
position: absolute;
border:solid;
}
</style>
<body>
<div id="map">active Div</div>
<script type="text/javascript">
var map=document.getElementById('map');
var isDrop=false
var disx,disy
map.onmousedown=function(event){
disx=event.pageX-map.offsetLeft
disy=event.pageY-map.offsetTop
isDrop=true
}
window.onmouseup=function(){
isDrop=false
}
window.onmousemove=function(event){
if(isDrop){
map.style.left=(event.pageX-disx)+'px'
map.style.top=(event.pageY-disy)+'px'
}
}
</script>
</body>
</html>