1, Default:
2, mouse Move up:
Source: Today in a colleague's phone book found in the phone, found that his phone number is the display name, and then just move down, you can display the corresponding number of this person. And then I thought to myself, it's pretty good. So I thought it was like a collection of similar effects. Slightly changed. Summary: The discovery of life everywhere, can be good at discovering, and then diligent thinking, Lenovo, which is indeed an advantage
。 <! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" > < HTML xmlns= "http://www.w3.org/1999/xhtml" xml:lang= "en" lang= "en" > <pead> <meta http-equiv= "Content-type" "Content=" text/html; CHARSET=GBK "/><title>comasp ' s blog</title> <style type=" text/css "> a{color: #FFFF99; Text-decoration:none; }a:hover{color: #FFFFFF; Text-decoration:underline; } #nav {padding:10px 10px 0; font-size:12px; Font-weight:bold; Margin:1em 0 0; List-style:none; }.bi{position:relative; z-index:0; }.bi:hover{z-index:99; }.bi:hover span{visibility:visible; top:0; left:0; Cursor:pointer; }.bi span{Position:absolute; Left: -999em; Visibility:hidden; #nav Li A,.bi:hover span{line-height:20px; Text-decoration:none; Background: #DDDDDD; Color: #666666; Display:block; width:80px; Text-align:center; #nav li a:hover,.bi:hover span{color: #FFFFFF; Background: #DC4E1B; }.bi:hover span{padding-top:2px; } </style> </pead> <body> <ul id= "NAV" > <li> John <span>13011111111< ;/span></li> <li> Dick <span>13022222222</span></li> <li> Harry <span> 13033333333</span></li> <li> Zhao Liu <span>13044444444</span></li> <li> What seven went to the <span>13055555555</span></li> </ul> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
