你要的应该是拖拽效果，可以通过jq插件做
基本原理就是鼠标按下修改div的left和top（或者right/bottom）。鼠标离开不变。
<!DOCTYPE html><html>
<head>
<script src="/jquery/jquery-1111minjs">
</script>
<Style>
#test{
position:absolute;
}
</style>
<script>
$(document)mousedown(function(){
$(this)mousemove(function(e){
$("#test")css({ "left": epageX+"px", "top": epageY+"px" });
$(document)mouseup(function(){
$(this)unbind('mousemove');
})
})
})
</script>
</head>
<body>
<div id="test">ssssssssss</div>
</body>
</html>
jquery中有2个对应的事件,那就是mouseover与mouseout。mouseover就是移动到元素触发的事件,mouseout就是离开元素触发事件。
示例：
当鼠标从元素上移开时，改变元素的背景色：
jQuery 代码:
$("div")mouseout(function(){
$("div")css("background-color","#E9E9E4");
});
$("div")mouseover(function(){
$("div")css("background-color","yellow");
});
<div id="a" style="width:500px;height:400px; display:block; background-color:#eee;margin:50px auto;"></div>
//引入jQuery
<script>
var a=$("#a");
var boxX=aoffset()left;
var boxY=aoffset()top;
amousemove(function(e){
var x = epageX;
var y = epageY;
var zX=x-boxX;
var zY=y-boxY;
$(this)text("X:"+zX+"Y:"+zY);
});
</script>
可以将DIV的滚动条滚动到其子元素所在的位置，方便自动定位。
var container = $('div'),
scrollTo = $('#row_8');
containerscrollTop(
scrollTooffset()top - containeroffset()top + containerscrollTop()
);
// Or you can animate the scrolling:
containeranimate({
scrollTop: scrollTooffset()top - containeroffset()top + containerscrollTop()
})
var container = $('div'),
scrollTo = $('#row_8');
containerscrollTop(
scrollTooffset()top - containeroffset()top + containerscrollTop()
);
// Or you can animate the scrolling:
containeranimate({
scrollTop: scrollTooffset()top - containeroffset()top + containerscrollTop()
});
不需要任何JQuery插件即可完成所需的效果，非常好用！
jq可以直接使用$("div")获得所有div，但是如果要具体到一个div的话，需要给div一个标记，然后通过html就可以获取值了。
1<div id="divId" class="divClass"> 内容 </div>
123/jq 代码 jq选择器/$("#divId")html();$("divClass")html();
以上就是关于用js控制div跟随鼠标移动，鼠标点击后，鼠标离开，div留在当前点击的位置怎么做全部的内容，包括:用js控制div跟随鼠标移动，鼠标点击后，鼠标离开，div留在当前点击的位置怎么做、请教一个问题，关于jquery判断鼠标移动到当前div和离开div的、jquery获取鼠标在父元素的坐标等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）