鼠标悬浮移出控制div的显示与隐藏

鼠标悬浮移出控制div的显示与隐藏

　　当鼠标悬浮在某一个触发div显示的元素上时，通常JS为：οnmοuseοver="javascript:showAlertInfo(ShowID);"

当鼠标从div上移出时我们希望隐藏已经显示的div，通常JS为：onmouseout ="javascript:hideAlertInfo(HideID);"。

这样做当然能控制div的显示与隐藏，但是当div里面包含其它元素时，隐藏功能就不能正常控制div的隐藏。当鼠标焦点停留在div包含的其它元素上时，div已经隐藏了，与我们预期的结果显然不符。我们要的结果是当鼠标移出div时，div才隐藏。那么就要将onmouseout事件改为onmouseleave事件,JS为：οnmοuseleave="javascript:hideAlertInfo(HideID);"。当鼠标停留在div上或者停留在包含的元素上时都不会将div隐藏。

　　出现这种情况的原因是：对于onmouseout事件，浏览器会把div和div里面包含的元素看成不同的对象，在鼠标在不同对象之间移动是会触发onmouseout事件，所以整个div会被