站内搜索: 请输入搜索关键词

当前页面: 开发资料首页Javascript 专题一个很通用的javascript的下拉菜单

一个很通用的javascript的下拉菜单

摘要: table,css,下拉菜单
<textarea readonly style="border:none;font-family:Courier New;line-height:150%;width:760px;overflow-y:visible">

这是css文件css.css的内容

.close{
visibility:hidden;
cellPadding=0; cellSpacing=0 ;
height:21px;font:9pt;text-align:center

}
.open{
visibility:visible;
cellPadding=0; cellSpacing=0 ;
height:24px;font:9pt;text-align:center;
BORDER-TOP: #000000 1px solid;
BORDER-BOTTOM: #000000 1px solid

}
.openleft{
visibility:visible;
cellPadding=0; cellSpacing=0 ;
height:24px;font:9pt;text-align:center;
BORDER-TOP: #000000 1px solid;
BORDER-LEFT:#000000 1px solid ;
BORDER-BOTTOM: #000000 1px solid
}
.openright{
visibility:visible;
cellPadding=0; cellSpacing=0 ;
height:24px;font:9pt;text-align:center;
BORDER-TOP: #000000 1px solid ;
BORDER-RIGHT:#000000 1px solid ;
BORDER-BOTTOM: #000000 1px solid
}

利用鼠标对象和表格的属性很容易实现下拉菜单!

<head>最后还是笑笑/情感

<link> href="CssFiles/css.css" type=text/css rel=stylesheet>
<body bgColor=#dedfde leftMargin=0 marginwidth="0" topmargin="0">

<table width="80%" align="center" cellPadding=0 cellSpacing=0 id="thelast" class=bian>

<tr height="67">
<td valign="top" width="9%" align=center >
<table width="100%" class=close onMouseOver="this.style.visibility='visible'" cellpadding="0" cellspacing="0">
<tr>
<td valign="center" title="本人本站的介绍" background="pic/back.jpg" height=23 class=openleft> 笑 笑</td>
</tr>
<tr>
<td valign="center" background="pic/back2.jpg">本 站</td>
</tr>
<tr>
<td valign="center" background="pic/back2.jpg">本 人</td>
</tr>
<tr>
<td valign="center" background="pic/back2.jpg">简 历</td>
</tr>
</table>

</td></tr>

</table>

</body>

具体的效果请看

http://kissan.533.net


</textarea>
↑返回目录
前一篇: JavaScript入门学习之一
后一篇: JavaScript对象与数组参考大全