通过使用简单的JavaScript的效果实现点击图片背景图片更换的效果

最新推荐文章于 2023-08-08 00:14:46 发布

Tea-pd

最新推荐文章于 2023-08-08 00:14:46 发布

阅读量2.8k

点赞数 8

分类专栏： js学习文章标签：前端 java javascript html5 css3

本文链接：https://blog.csdn.net/tea_tea_/article/details/125608785

版权

前言：本人是新生小白，JavaScript学的很菜，如有错误之处欢迎指出。

5.接下来我们通过点击事件获取到点击图片的路径

6.设置格式

7.最终代码

1.首先我们先创建一个html文件

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
	</body>
</html>

2.然后插入3张图片

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			img{
				width: 150px;
				height: 150px;
			}
			
			body{
				background-image: url(img/1.png);
				background-size: cover;
				background-repeat: no-repeat;
			}
		</style>
	</head>
	<body>
			<img src="./img/1.png" alt="">
			<img src="./img/2.png" alt="">
			<img src="./img/3.png" alt="">
			

	</body>
</html>