有4张图片,点击某一张,变大,其他回复正常大小
效果图如下
![]()
代码如下
<!DOCTYPE html>
<html>
<head>
<title>图片缩放</title>
<style type="text/css">
.first
{
width: 200px;
height: 300px;
}
.second
{
width: 400px;
height: 400px;
}
</style>
<script type="text/javascript">
function change(obj) {
var imgs = document.getElementsByTagName("img");
for(var i=0;i<imgs.length;i++)
imgs[i].className="first";
obj.className="second";
}
</script>
</head>
<body>
<img src="D:\\图片\\QQ截图20160616215058.png" id="one" class="first" onclick="change(this)">
<img src="D:\\图片\\QQ截图20170521133435.png" id="two" class="first" onclick="change(this)">
<img src="D:\\图片\\QQ截图20170521133638.png" id="three" class="first" onclick="change(this)">
<img src="D:\\图片\\TIM截图20170701112403.png" id="four" class="first" onclick="change(this)">
</body>
</html>
注:图片地址另配