<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<title>Document</title>
<style>
*{margin: 0;
padding: 0;
}
div{
width: 100px;
height: 100px;
background: red;
position: absolute;
left: 0;
top: 0;
}
</style>
</head>
<body>
<div>
</div>
</body>
</html>
<script src="jquery-1.7.2.js"></script>
<script>
$('div').mousedown(function(e){
// alert(1);
var _x = e.pageX-parseInt($('div').css('left'));
var _y = e.pageY-parseInt($('div').css('top'));
// alert(_x);
$(document).mousemove(function(e) {
var x = e.pageX-_x;
var y = e.pageY-_y;
$('div').css({'left':x,'top':y});
});
$(document).mouseup(function() {
$(document).unbind('mousemove');
$(document).unbind('mouseup');
});
return false;//
});
</script>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<title>Document</title>
<style>
*{margin: 0;
padding: 0;
}
div{
width: 100px;
height: 100px;
background: red;
position: absolute;
left: 0;
top: 0;
}
</style>
</head>
<body>
<div>
</div>
</body>
</html>
<script src="jquery-1.7.2.js"></script>
<script>
$('div').mousedown(function(e){
// alert(1);
var _x = e.pageX-parseInt($('div').css('left'));
var _y = e.pageY-parseInt($('div').css('top'));
// alert(_x);
$(document).mousemove(function(e) {
var x = e.pageX-_x;
var y = e.pageY-_y;
$('div').css({'left':x,'top':y});
});
$(document).mouseup(function() {
$(document).unbind('mousemove');
$(document).unbind('mouseup');
});
return false;//
});
</script>