1 <div style="position:absolute;left:40%;top:10%;border-style:dotted">
2 <img src="zgl.jpg"/><br/>
3 <center>
4 <input type="button" value="隐藏"/>
5
6 <input type="button" value="显示"/>
7 </center>
8 </div>
9 <script type="text/javascript">
10 document.getElementsByTagName("input")[0].onclick=function(){
11 //将图像隐藏
12 var imgElement = document.images[0];
13 imgElement.style.visibility="hidden";
14 }
15 document.getElementsByTagName("input")[1].onclick=function(){
16 //将图像显示
17 var imgElement = document.images[0];
18 imgElement.style.visibility="visible";
19 }
20 document.getElementsByTagName("div")[0].onmouseover=function(){
21 //将图片放大
22 var imgElement = document.images[0];
23 //获取原来图片的大小
24 x = imgElement.width;
25 y = imgElement.height;
26 imgElement.width=imgElement.width*1.5;
27 imgElement.height=imgElement.height*1.5;
28 }
29 document.getElementsByTagName("div")[0].onmouseout=function(){
30 //将图片还原
31 var imgElement = document.images[0];
32 imgElement.width=x;
33 imgElement.height=y;
34 }
35 //全局变量
36 var x;
37 var y;
38 </script>
js 事件点击 显示 隐藏
时间: 2024-08-05 02:26:17