javascript制作图片跟随鼠标效果

最新推荐文章于 2024-11-14 14:55:48 发布

不问匆匆

最新推荐文章于 2024-11-14 14:55:48 发布

阅读量226

点赞数

分类专栏：新手文章标签： javascript

本文链接：https://blog.youkuaiyun.com/weixin_44830974/article/details/89976197

版权

新手专栏收录该内容

40 篇文章

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
		img{width: 50px;height: 50px;position: absolute;border-radius: 50%;}
	</style>
</head>
<body>
	<script type="text/javascript">
		var oImg=createImg();//创建img
		document.onmousemove=function (e){
			e=e||window.event;
			//获取鼠标位置
			var x=e.clientX;
			var y=e.clientY;
			oImg.style.left=x+15+'px';
			oImg.style.top=y+15+'px';
			document.body.appendChild(oImg);
		};

		function createImg(){
			var img=document.createElement('img');
			img.src='images/3.jpg';
			return img;
		}
	</script>
</body>
</html>