为图片设置了一个父级div,设置的是相对父级div的鼠标移动事件。但是当鼠标移出此div后图片还是可以跟随鼠标移动。而且当鼠标移动速度过快离开了图片,图片就不会再移动了
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
img{
position:absolute;
width: 50px;
height: 50px;
}
div{
background-color:red;
width: 300px;
height: 300px;
}
</style>
</head>
<body>
<div id="dv">
<img src="1.jpg" alt="" id="im">
</div>
<script>
my$("dv").onmousemove=function(e){
document.getElementById("im").style.left=e.clientX-20+"px";
document.getElementById("im").style.top=e.clientY-20+"px";
console.log(e.clientX+"hhh"+e.clientY);
}
function my$(element){
return document.getElementById(element);
}
</script>
</body>
</html>
代码如上,求大神解惑。。。