触发型导航菜单

 code:

 

< html >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312" >
< title > 触发型导航菜单 </ title >
< 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 >
</ head >

< body >
<!-- 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 >< BR >< BR >
                                            </ TD >
                                        </ TR >
                                   </ TBODY >
                               </ TABLE >
                         </ TD >
                     </ TR >
                </ TBODY > <!-- 关于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 > 应用于TR、TABLE。 < BR >< BR >< BR >< BR >
                                      </ TD >
                                  </ TR >
                              </ TBODY >
                           </ TABLE >
                       </ TD >
                   </ TR >
               </ TBODY > <!-- 关于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 >< BR >< BR >
                                  </ TD >
                              </ TR >
                          </ TBODY >
                       </ TABLE >
                    </ TD >
                 </ TR >
              </ TBODY > <!-- 关于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 > 可能的值为block、none、inline、list-item、table-header-group、table-footer-group。 < BR > 该特性可读写，块要素默认值为block，内联要素默认值为inline；层叠样式表（CSS）属性不可继承。 < BR >< BR >< 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 >
</ body >
</ html >