41、触发式 菜单代码特效

41、触发式 菜单代码特效

<html>

 

<head>

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

<title>网页特效代码---经典实用的触发型导航菜单</title>

 

</head>

 

<body>

 

<STYLE type=text/css>.sec1 {

       BORDER-RIGHT: gray 1px solid; BORDER-TOP:

 

#ffffff 1px solid; BORDER-LEFT: #ffffff 1px

 

solid; CURSOR: hand; COLOR: #000000; BORDER-

 

BOTTOM: #ffffff 1px solid; BACKGROUND-COLOR:

 

#eeeeee

}

.sec2 {

       BORDER-RIGHT: gray 1px solid; BORDER-TOP:

 

#ffffff 1px solid; FONT-WEIGHT: bold; BORDER-

 

LEFT: #ffffff 1px solid; CURSOR: hand; COLOR:

 

#000000; BACKGROUND-COLOR: #d4d0c8

}

.main_tab {

       BORDER-RIGHT: gray 1px solid; BORDER-

 

LEFT: #ffffff 1px solid; COLOR: #000000; BORDER-

 

BOTTOM: gray 1px solid; BACKGROUND-COLOR: #d4d0c8

}

</STYLE>

<!--JavaScript部分-->

            <SCRIPT language=javascript>

     function secBoard(n)

  {

    for(i=0;i<secTable.cells.length;i++)

      secTable.cells

 

[i].className="sec1";

    secTable.cells[n].className="sec2";

    for(i=0;i<mainTable.tBodies.length;i++)

      mainTable.tBodies

 

[i].style.display="none";

    mainTable.tBodies

 

[n].style.display="block";

  }

      </SCRIPT>

<!--HTML部分-->

            <TABLE id=secTable cellSpacing=0 cellPadding=0 width=549 border=0>

              <TBODY>

              <TR align=middle height=20>

                <TD class=sec2 onclick=secBoard(0) width="10%">关于TBODY标记</TD>

                <TD class=sec1 onclick=secBoard(1) width="10%">关于cells集合</TD>

                <TD class=sec1 onclick=secBoard(2) width="10%">关于tBodies集合</TD>

                <TD class=sec1 onclick=secBoard(3) width="10%">关于display属性</TD></TR></TBODY></TABLE>

            <TABLE class=main_tab id=mainTable height=240 cellSpacing=0 cellPadding=0 width=549 border=0><!--关于TBODY标记-->

              <TBODY style="DISPLAY: block">

              <TR>

                <TD vAlign=top align=middle><BR><BR>

                  <TABLE cellSpacing=0 cellPadding=0 width=490 border=0>

                    <TBODY>

                    <TR>

                      <TD>指定行做为表体。

 

<BR>注释:TBODY要素是块要素,并且需要结束标

 

签。<BR>   即使如果表格没有显式定义TBODY

 

要素,该要素也提供给所有表。<BR><BR>

 

参考:《动态HTML参考和开发应用大全》(人民邮电出

 

版社

                        Microsoft Corporation

                    北京华中兴业科技发展有限公司

 

译)

 

<BR><BR></TD></TR></TB

 

ODY></TABLE></TD></TR></T

 

BODY><!--关于cells集合-->

              <TBODY style="DISPLAY:

 

none">

              <TR>

                <TD vAlign=top

 

align=middle><BR><BR>

                  <TABLE cellSpacing=0

 

cellPadding=0 width=490 border=0>

                    <TBODY>

                    <TR>

                      <TD>检索表行或者整个

 

表中所有单元格的集合。<BR>应用于TRTABLE

 

<BR><BR>参考:《动态HTML参考和开发应

 

用大全》(人民邮电出版社

                        Microsoft Corporation

                    北京华中兴业科技发展有限公司

 

译)

 

<BR><BR></TD></TR></TB

 

ODY></TABLE></TD></TR></T

 

BODY><!--关于tBodies集合-->

              <TBODY style="DISPLAY:

 

none">

              <TR>

                <TD vAlign=top

 

align=middle><BR><BR>

                  <TABLE cellSpacing=0

 

cellPadding=0 width=490 border=0>

                    <TBODY>

                    <TR>

                      <TD>检索表中所有TBODY

 

对象的集合。对象在该集合中按照HTML源顺序排列。

 

<BR>应用于TABLE<BR><BR>参考:

 

《动态HTML参考和开发应用大全》(人民邮电出版社

                        Microsoft Corporation

                    北京华中兴业科技发展有限公司

 

译)

 

<BR><BR></TD></TR></TB

 

ODY></TABLE></TD></TR></T

 

BODY><!--关于display属性-->

              <TBODY style="DISPLAY:

 

none">

              <TR>

                <TD vAlign=top

 

align=middle><BR><BR>

                  <TABLE cellSpacing=0

 

cellPadding=0 width=490 border=0>

                    <TBODY>

                    <TR>

                      <TD>设置或者检索对象

 

是否被提供。<BR>可能的值为blocknone

 

inlinelist-itemtable-header-grouptable-

 

footer-group<BR>该特性可读写,块要素默认

 

值为block,内联要素默认值为inline;层叠样式表

 

CSS)属性不可继承。<BR><BR>参考:《

 

动态HTML参考和开发应用大全》(人民邮电出版社

                        Microsoft Corporation

 

北京华中兴业科技发展有限公司译)

 

<BR><BR><A

                       

 

href="http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/display.asp?frame=true"                        target=_blank>点击此处

</A>可参阅微软<A href="http://msdn.microsoft.com/" target=_blank>MSDN在线</A>上的解释。

             

 

</TD></TR></TBODY></TABLE>

 

;</TD></TR></TBODY></TABLE&g

 

t;</body>

 

</html>

 

Write a comment

Comments: 0