<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> </head> <body> <img name="a" src="imgs/index-banner.png"> <img name="b" src="imgs/MORE.png"> <script> var flag = true,//状态true为正常的状态,false为放大的状态 imgH,//图片的高度 imgW,//图片的宽度 imga = document.getElementsByName("a")[0];//图片元素 imgb = document.getElementsByName("b")[0];//图片元素 b.onclick = function(){ //图片点击事件 imgH = imga.height; //获取图片的高度 imgW = imga.width; //获取图片的宽度 if(flag){ //图片为正常状态,设置图片宽高为现在宽高的2倍 flag = false;//把状态设为放大状态 imga.height = imgH*2; imga.width = imgW*2; }else{ //图片为放大状态,设置图片宽高为现在宽高的二分之一 flag = true;//把状态设为正常状态 imga.height = imgH/2; imga.width = imgW/2; } } </script> </body> </html>
时间: 2024-12-29 11:55:20