点击运行
<html> <head> <style> table { font-size:12; background-color:#c0c0c0; } span { border:groove 2px; padding:3; font-family:arial; font-size:12; width:90; height:40; background-color:#c0c0c0; position:relative; top:-15; left:-80; } </style> <script type="text/javascript"> function showmenu(elmnt) { elmnt.style.left="-10" } function hidemenu(elmnt) { elmnt.style.left="-80" } </script> </head> <body> <span onmouseover="showmenu(this)" onmouseout="hidemenu(this)"> <table border="0" width="100%"> <tr> <td width="90%"><a href="/index.html">HOME</a></td> <td rowspan="2">A</td> </tr><tr> <td><a href="/js/index.php">JavaScript</a></td> </tr> </table> </span> <br /> <span onmouseover="showmenu(this)" onmouseout="hidemenu(this)"> <table width="100%"> <tr> <td width="90%"><a href="http://www.microsoft.com">Explorer</a></td> <td rowspan="2">B</td> </tr><tr> <td><a href="http://my.netscape.com">Navigator</a></td> </tr> </table> </span> <br /> <span onmouseover="showmenu(this)" onmouseout="hidemenu(this)"> <table width="100%"> <tr> <td width="90%"><a href="http://www.altavista.com">AltaVista</a></td> <td rowspan="2">C</td> </tr><tr> <td><a href="http://www.yahoo.com">Yahoo!</a></td> </tr> </table> </span> </body> </html>
运行结果
