js-图片缩放

来源：互联网发布：婴儿床什么牌子好知乎编辑：程序博客网时间：2024/05/29 19:20

有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>

注：图片地址另配

阅读全文

0 0