<!DOCTYPE >
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
img {
width: 90px;
height: 90px;
position: absolute;
/*不加position:absolute图片不会跟着鼠标走*/
}
</style>
</head>
<body>
<img src="images/angle.gif" />
<script type="text/javascript">
var pic = document.querySelector('img');
document.addEventListener('mousemove', function(e) {
var x = e.pageX;
var y = e.pageY;
//位置一定要加上‘px’!!!!!!
pic.style.left = x - 45 + 'px';
pic.style.top = y - 45 + 'px';
//减去45是因为鼠标可以在图片的正中央,而图片大小为90*90,所有是一半45
})
</script>
</body>
</html>
图片跟着鼠标走
最新推荐文章于 2023-08-01 21:07:29 发布