js 事件点击 显示 隐藏
时间:2014-05-09 13:31:13
收藏:0
阅读:401
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>
评论(0)