Posted in Javascript onDecember 29, 2013
<html> <head> <style type="text/css"> .menu { background-color:green; width:120; height:20; color: white; text-align: center; font-size:9pt; font-weight:bolder; } .submenu { position:absolute; top:40; background-color: yellow;width:180; font-size:9pt; } </style> </head> <body> <SCRIPT> var cm=null; document.onclick = new Function("show(null)") function getPos(el,sprop) {var iPos = 0 while (el!=null) {iPos+=el["offset" + sprop] el = el.offsetParent} return iPos} function show(el,m) {if (m) { m.style.display=''; m.style.pixelLeft = getPos(el,"Left") m.style.pixelTop = getPos(el,"Top") + el.offsetHeight} if ((m!=cm) && (cm)) cm.style.display='none';cm=m} </SCRIPT> <table border=0> <tr> <td ID="d1" onmouseover="show(this,ds1);" class="menu">杂志技术站点</td> <td ID="d2" onmouseover="show(this,ds2);" class="menu">门户站点</td> <td ID="d3" onmouseover="show(this,ds3);" class="menu">个人收藏站点</td> </tr> </table> <DIV ID="ds1" CLASS="submenu" STYLE="display:none" onmouseleave="this.style.display='none'"> <BR><A HREF="http://www.yesky.com">天极网 Yesky.com</A> <BR><A HREF="http://www.cbinews.com">电脑商情报</A> <BR><A HREF="http://www.newsoft.com.cn">新潮电子</A> <BR> </DIV> <DIV ID="ds2" CLASS="submenu" STYLE="display:none" onmouseleave="this.style.display='none'"> <BR><A HREF="http://www.sina.com.cn">新浪网 Sina</A> <BR><A HREF="http://www.sohu.com.cn">搜狐 Sohu</A> <BR><A HREF="http://www.163.com">网易 Netease</A> <BR> </DIV> <DIV ID="ds3" CLASS="submenu" STYLE="display:none" onmouseleave="this.style.display='none'"> <BR><A HREF="http://haoel.yeah.net">耗子网络编程站</A> <BR><A HREF="http://www.5460.net">中国同学录</A> <BR><A HREF="http://www.csdn.net">中国软件开发网</A> <BR> </DIV> </body> </html>
javascript轻松实现当鼠标移开时已弹出子菜单自动消失
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@