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

王朝html/css/js·作者佚名  2006-01-08
窄屏简体版  字體: |||超大  

这是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

}

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

<HTML><HEAD><TITLE>最后还是笑笑/情感</TITLE>

<META http-equiv=Content-Type content="text/html; charset=gb2312">

<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

onMouseOut="this.style.visibility='hidden'";

onMouseOver="this.style.visibility='visible'" cellpadding="0" cellspacing="0">

<tr>

<td valign="center" title="本人本站的介绍" background="pic/back.jpg" height=23 class=openleft><a href='#'> 笑 笑</a></td>

</tr>

<tr>

<td valign="center" background="pic/back2.jpg"><a href="bzjs.html" target="_blank">本 站</a></td>

</tr>

<tr>

<td valign="center" background="pic/back2.jpg"><a href="grjj.html" target="_blank">本 人</a></td>

</tr>

<tr>

<td valign="center" background="pic/back2.jpg"><a href="jl.html" target="_blank">简 历</a></td>

</tr>

</table>

</TD></TR>

</TABLE>

</BODY>

</HTML>

具体的效果请看

http://kissan.533.net

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
 
© 2005- 王朝網路 版權所有  導航