js 事件点击 显示 隐藏

 

 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                   &nbsp;&nbsp;&nbsp;&nbsp;
 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>