任务2-2 带关闭功能的登录界面的制作
需求：
一般状态（鼠标移出时）右上角的“关闭”按钮×显示为白色，当鼠标移入到登录界面右上角的“关闭”按钮区域时，按钮中×突显为红色，单击该按钮区域则隐藏登录界面。
分析：
使用HTML标签的鼠标移入、移出与单击事件实现。
实现：
第一步，制作如图2-6所示的两个大小相同、按钮中×背景色不同的关闭按钮。
图2-6 鼠标移出、移入时两个不同图像
第二步，新建文件夹02，复制任务2-1的页面到02文件夹中。
第三步，在登录界面DIV内放置一个绝对定位的按钮DIV，设置其id为“btn_Close”，设置背景图像，并按图像大小设置按钮DIV的width和height（width： 36px； height： 20px），其代码如清单2-5所示。
清单2-5 关闭按钮区域的定义
第四步，将登录界面左上角的按钮DIV拖放到登录界面标题栏的合适位置（left： 209px； top：16px）。
第五步，设置按钮DIV的鼠标单击事件（click）、移入事件（mouseover）和移出事件（mouseout）处理函数。属性设置如清单2-6所示。
清单2-6 关闭按钮的鼠标事件属性的设置
第六步，编写鼠标事件处理函数。为了实现关闭登录界面，需对登录界面DIV设置其id属性“frm_Login”。事件代码如清单2-7所示。
清单2-7 关闭按钮的鼠标事件处理函数的定义
说明
（1）不能将DIV的事件处理的函数名设置为事件属性名，如onclick="onclick（），否则会因不停地循环调用，造成堆栈溢出。
（2）设置DIV的背景图像时，属性值url（'out_qq.png'）中的单引号不能遗漏。
（3）打开DIV显示可以设置样式属性display为block。如果界面中添加一个按钮，则设置按钮的onclick属性为frm_Login.style.display="block"。