div怎么才能跟随鼠标移动啊？ 一下是我的代码,但是光看见鼠标的坐标移动,div却一点反应都没有啊

Question

js代码：
$(document).ready(function() {
$(document).bind("mousemove", function(e) {
var y = e.clientY;
var x = e.clientX;
$("#movediv").offset({ top: y, left: x });
$("#movediv").html("top:" + y + "<br>left:" + x);
});
});

html内容：
<div id="movediv" style="left: 20px; top: 20px;">
move</div>
答案请原创,兼容浏览器,使用JQ,为你,为他,为我,方便人日后查看..
谢谢
我把div设置成为
<div id="movediv" style="left: 20px; top: 20px;position:absolute;">
move</div>
绝对位置还是不能跟随鼠标移动啊？？？
CHZHtby的回答还是不能让div移动... 是不是要把div放在某个相对的容器里？

Answer 1

你要设置div的style位置为绝对位置。

<div id="movediv" style="left: 20px; top: 20px;position:absolute;">
move</div>
$(document).mousemove(function(e){
var y = e.pageY;
var x = e.pageX;
$("#movediv").offset({ top: y, left: x });
$("#movediv").html("top:" + y + "<br>left:" + x);
});

看到没有。。这个应该可以了

Answer 2

另换了段代码，不过只有在IE下可以运行：
<script type="text/javascript">
var div_xx = 0;
var div_yy = 0;
function keyd(divid){
var obj = document.getElementById(divid);
obj.style.cursor = "move";
div_xx = event.clientX-obj.getBoundingClientRect().left;
div_yy = event.clientY-obj.getBoundingClientRect().top;
tow(obj);
}
function keyu(divid){
var obj = document.getElementById(divid);
window.document.onmousemove = null;
obj.style.cursor = "default";
}
function tow(obj){
window.document.onmousemove = function(){
modiv(obj);
};
}
function modiv(obj){
obj.style.top = event.clientY+document.body.scrollTop-div_yy;
obj.style.left = event.clientX+document.body.scrollLeft-div_xx;
}
</script>
<div onmousedown="keyd('divid')" onmouseup="keyu('divid')" style="width:30px; height:30px; background: #FF0000; position:relative" id="divid"></div>
</div>
本回答被提问者和网友采纳

Answer 3

<div id="movediv" style="position:absolute;left: 20px; top: 20px;">
move</div>