页面事件是在页面加载或改变浏览器的大小、位置,以及对页面中的滚动条进行操作时,所触发的事件处理程序。
加载与卸载事件
加载事件(onload)是在网页加载完毕后触发相应的事件处理程序,它可以在网页加载完成后对网页中的表格样式、字体、背景颜色等进行设置。卸载事件(unload) 是在卸载网页时触发相应的事件处理程序,卸载网页是指关闭当前页或从当前页跳转到其他网页中,该事件常被用于在关闭当前页或跳转其他网页时,弹出询问提示框。
在制作网页时,为了便于网页资源的利用,可以在网页加载事件中对网页中的元素进行设置。
例子:网页加载时缩小图片
在网页加载时,将图片缩小成指定的大小,当鼠标指针移动到图片上时,将图片大小情复成原始大小,这样可以避免使用大小相同的两个图片进行切换,并在关闭网页时,用提示框提示月户是否关闭当前页。
1<html> 2 <head> 3 <meta charset="utf-8"> 4 <title></title> 5 6 </head> 7 <body onunload="pclose()"> 8 <img src="img/banner01.png" name="img1" onload="blowup()" onmouseover="blowup()" onmouseover="reduce()"/> 9 <script type="text/javascript"> 10 var h=img1.height; 11 var w=img1.width; 12 function blowup(){ //缩小图片 13 if(img1.height>=h){ 14 img1.height=h-100; 15 img1.width=w-100; 16 } 17 } 18 function reduce(){ //恢复原始大小 19 if(img1.height>=h){ 20 img1.height=h; 21 img1.width=w; 22 } 23 } 24 function pclose(){ //卸载时弹出提示框 25 alert("欢迎浏览本网页"); 26 } 27 </script> 28 </body> 29 30</html>