鼠标经过事件代码

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta  name ="Keywords"  content =""   />
< meta  name ="Description"  content =""   />
< title > CSS Tooltips </ title >
< link  rel ="stylesheet"  rev ="stylesheet"  href ="style/master.css"  type ="text/css"  media ="screen, projection"  charset ="utf-8"   />
< style  type ="text/css" > ...
<!--
/**//*Tooltips*/
.displayspan{...}{ /**//*span 标签仅在 :hover 状态时显示*/
    display:block;
    position:absolute;
    top:32px;
    left:9px;
    width:15em;
    height:30em;
    border:1px solid black;
    background-color:#778899;
    padding: 3px;
    color: white;
    font-size:12px;
    }
.nodisplay{...}{
    display:none;
    }
-->
</ style >
</ head >
< body >
< div  onmouseover ="document.getElementById('span1').className='displayspan';"  onmouseout ="document.getElementById('span1').className='nodisplay';" >
< a  class ="tooltips"  href ="#tooltips" > 这就是Tooltips </ a >
< span  id ="span1"  name ="span1"  class ="nodisplay" > 如你所见，这些附加的说明文字在鼠标经过的时候显示。
< dl >
< dt > Neyond1 </ dt >< dd >< a  href ="Design.htm" > new! </ a ></ dd >
</ dl >
< dl >
< dt > Neyond2 </ dt >< dd >< a  href ="Design.htm" > new! </ a ></ dd >
</ dl >
< dl >
< dt > Neyond3 </ dt >< dd >< a  href ="Design.htm" > new! </ a ></ dd >
</ dl >
< dl >
< dt > Neyond4 </ dt >< dd >< a  href ="Design.htm" > new! </ a ></ dd >
</ dl >
< dl >
< dt > Neyond5 </ dt >< dd >< a  href ="Design.htm" > new! </ a ></ dd >
</ dl >
</ span >
</ div >
</ body >
</ html >