tab控件

<html>
<head runat="server">
<title>无标题页</title>
<style type="text/css">
body {font-size:12px;font-family:宋体;
margin-left: 4px;
margin-top: 6px;
margin-right: 0px;
margin-bottom: 0px;
}
ul.TabBarLevel1{
list-style:none;
margin:0;
padding:0;
height:29px;
background-image:url(img/20060906_001.gif);
}
ul.TabBarLevel1 li{
float:left;
padding:0;
height:29px;
margin-right:1px;
background:url(img/20060906_002.gif) left top no-repeat;
}
ul.TabBarLevel1 li a{
display:block;
line-height:29px;
padding:0 20px;
color:#333;
background:url(img/20060906_003.gif) right top no-repeat;
white-space: nowrap;
}
ul.TabBarLevel1 li.Selected{
background:url(img/20060906_004.gif) left top no-repeat;
}
ul.TabBarLevel1 li.Selected a{
background:url(img/20060906_005.gif) right top no-repeat;
}

ul.TabBarLevel1 li a:link,ul.TabBarLevel1 li a:visited{
color:#333;
}
ul.TabBarLevel1 li a:hover,ul.TabBarLevel1 li a:active{
color:#F30;
text-decoration:none;
}
ul.TabBarLevel1 li.Selected a:link,ul.TabBarLevel1 li.Selected a:visited{
color:#000;
}
ul.TabBarLevel1 li.Selected a:hover,ul.TabBarLevel1 li.Selected a:active{
color:#F30;
text-decoration:none;
}
div.HackBox {
width: 150px ;
padding : 2px 2px ;
border-left: 5px solid #d7d7d7;
border-right: 5px solid #d7d7d7;
border-bottom: 5px solid #d7d7d7;
display:none;
}

</style>
<style   type="text/css">
.tblBlueline   {
background-color:   #;
cursor:   hand;
}
.tblSubDeepBlue   {
background-color:   #cecece;
cursor:   hand;
}
</style>
<script type="text/javascript" language="javascript">
var   CurrentID="";
function   ClickEvent(tdID)
{
if(CurrentID!="")
{
eval(CurrentID+".className='tblBlueline'");
}
CurrentID=tdID.id;
}
function   OutEvent(tdID)
{
if(CurrentID==tdID.id)
{
tdID.className='tblSubDeepBlue';
}
else
{
tdID.className='tblBlueline';
}
}
</script>
<script type="text/javascript">
function showsubmenu(sid)
{
whichEl = eval("submenu" + sid);
imgmenu = eval("imgmenu" + sid);
if (whichEl.style.display == "none")
{
eval("submenu" + sid + ".style.display=\"\";");

}
else
{
eval("submenu" + sid + ".style.display=\"none\";");

}
}
</script>
<script type="text/javascript" language="JavaScript">
//Switch Tab Effect
function switchTab(tabpage,tabid){
        var oItem = document.getElementById(tabpage);
for(var i=0;i<oItem.children.length;i++){
  var x = oItem.children(i);
  x.className = "";
  var y = x.getElementsByTagName('a');
  y[0].style.color="#333333";
}
document.getElementById(tabid).className = "Selected";
var dvs=document.getElementById("cnt").getElementsByTagName("div");
for (var i=0;i<dvs.length;i++){
   if (dvs[i].id==('d'+tabid))
     dvs[i].style.display='block';
   else
   dvs[i].style.display='none';
}
}

</script>
</head>
<body>
<div id="Whatever">
<ul class="TabBarLevel1" id="TabPage1" style="width: 164px">
  <li id="Tab2" class="Selected" style="height: 25px; width: 80px; text-align: center;"><a href="#" onclick="javascript:switchTab('TabPage1','Tab2');">中文</a></li>
  <li id="Tab3" style="width: 80px; height: 25px; text-align: center;"><a href="#" onclick="javascript:switchTab('TabPage1','Tab3');">英文</a></li>
</ul>
<div id="cnt">
<div id="dTab2" class="HackBox" style="display:block; width: 150px; height: 260px;">
    <table border="0" style="background-color:#ffffff; width: 96%;" cellpadding="0" cellspacing="0" >
<tr>
<td style="width: 97px">
<table style="text-align:center; width: 150px;" cellspacing="0" cellpadding="0">
        <tr>
            <td align="center" id="imgmenu1" style="background-image:url(image/ds01.gif);cursor: hand; height: 25px; text-align: left; width: 156px;" onclick="showsubmenu(1)">
                <span style="font-size: 10pt">   产品管理</span></td>
        </tr>
        <tr>
            <td id="submenu1" style="width: 156px">

                <table border="0" cellpadding="0" cellspacing="0" class="kuang" style="width: 150px">
                                <tr><a href="producttypeC/ManageaddCptype.aspx" target="frame2">
                                    <td style="height: 21px;text-align: left; width: 67px;" id="td1" onclick="ClickEvent(this)"   class="tblBlueline"   onmouseover="this.className='tblSubDeepBlue'"   onmouseout="OutEvent(this)">
                                          
                                    分类管理</td></a>
                                </tr>
                            </table>
                            <table border="0" cellpadding="0" cellspacing="0" class="kuang" style="width: 150px">
                                <tr><a href="producttypeC/addCproduct.aspx" target="frame2">
                                    <td style="height: 21px;text-align: left;" id="td2" onclick="ClickEvent(this)"   class="tblBlueline"   onmouseover="this.className='tblSubDeepBlue'"   onmouseout="OutEvent(this)">
                                          
                                    添加产品信息</td></a>
                                </tr>
                            </table>
</td></tr>
</table>
<table style="text-align:center; width: 150px;" cellspacing="0" cellpadding="0">
        <tr>
            <td align="center" id="imgmenu2" style="background-image:url(image/ds01.gif); cursor: hand;text-align: left; height: 25px; width: 165px;" onclick="showsubmenu(2)">
                <span style="font-size: 10pt">   产品信息中心</span></td>
        </tr>
        <tr>
            <td id="submenu2" style="width: 165px">
            <table border="0" cellpadding="0" cellspacing="0" class="kuang" style="width: 150px">
                <tr><a href="producttypeC/productManage.aspx"target="frame2">
                    <td style="height: 21px;text-align: left;" id="td3" onclick="ClickEvent(this)"   class="tblBlueline"   onmouseover="this.className='tblSubDeepBlue'"   onmouseout="OutEvent(this)">
                          
                        所有产品</td></a>
                </tr>
            </table>
            <table border="0" cellpadding="0" cellspacing="0" class="kuang" style="width: 150px">
                  <tr><a href="producttypeC/productManage1.aspx" target="frame2">
                        <td style="height: 21px;text-align: left;" id="td4" onclick="ClickEvent(this)"   class="tblBlueline"   onmouseover="this.className='tblSubDeepBlue'"   onmouseout="OutEvent(this)">
                          
                        已发布至网站的产品</td></a>
                    </tr>
            </table>
            <table border="0" cellpadding="0" cellspacing="0" class="kuang" style="width: 150px">
                  <tr><a href="producttypeC/productManage2.aspx" target="frame2">
                        <td style="height: 21px;text-align: left;" id="td5" onclick="ClickEvent(this)"   class="tblBlueline"   onmouseover="this.className='tblSubDeepBlue'"   onmouseout="OutEvent(this)">
                          
                        未发布至网站的产品</td></a>
                    </tr>
            </table>
            <table border="0" cellpadding="0" cellspacing="0" class="kuang" style="width: 150px">
                  <tr><a href="producttypeC/productManagex.aspx" target="frame2">
                        <td style="height: 21px;text-align: left;" id="td6" onclick="ClickEvent(this)"   class="tblBlueline"   onmouseover="this.className='tblSubDeepBlue'"   onmouseout="OutEvent(this)">
                          
                        产品回收站</td></a>
                    </tr>
            </table>
               </td></tr>
</table>
</td>
</tr>
</table>
</div>
<div id="dTab3" class="HackBox" style="width: 150px">
<table border="0" style="background-color:#ffffff; width: 96%; height: 260px;" cellpadding="0" cellspacing="0" >
<tr>
<td valign="top" style="width: 35px; height: 218px">
    <table style="text-align:center; width: 150px;" cellspacing="0" cellpadding="0">
        <tr>
            <td align="center" id="imgmenu3" style="background-image:url(image/ds01.gif);cursor: hand; height: 25px; text-align: left;" onclick="showsubmenu(3)">
                <span style="font-size: 10pt">   产品管理</span></td>
        </tr>
        <tr>
            <td id="submenu3">

                <table border="0" cellpadding="0" cellspacing="0" class="kuang" style="width: 150px">
                                <tr><a href="producttypeE/ManageaddCptype.aspx" target="frame2">
                                    <td style="height: 21px;text-align: left; width: 67px;" id="td7" onclick="ClickEvent(this)"   class="tblBlueline"   onmouseover="this.className='tblSubDeepBlue'"   onmouseout="OutEvent(this)">
                                          
                                    分类管理</td></a>
                                </tr>
                            </table>
                            <table border="0" cellpadding="0" cellspacing="0" class="kuang" style="width: 150px">
                                <tr><a href="producttypeE/addCproduct.aspx" target="frame2">
                                    <td style="height: 21px; text-align: left;" id="td8" onclick="ClickEvent(this)"   class="tblBlueline"   onmouseover="this.className='tblSubDeepBlue'"   onmouseout="OutEvent(this)">
                                          
                                    添加产品信息</td></a>
                                </tr>
                            </table>
</td></tr>
</table>
<table style="text-align:center; width: 150px;" cellspacing="0" cellpadding="0">
        <tr>
            <td align="center" id="imgmenu4" style="background-image:url(image/ds01.gif); cursor: hand;text-align: left; height: 25px; width: 160px;" onclick="showsubmenu(4)">
                <span style="font-size: 10pt">   产品信息中心</span></td>
        </tr>
        <tr>
            <td id="submenu4" style="width: 160px">
            <table border="0" cellpadding="0" cellspacing="0" class="kuang" style="width: 150px">
                <tr><a href="producttypeE/productManage.aspx"target="frame2">
                    <td style="height: 21px;text-align: left;" id="td11" onclick="ClickEvent(this)"   class="tblBlueline"   onmouseover="this.className='tblSubDeepBlue'"   onmouseout="OutEvent(this)">
                          
                        所有产品</td></a>
                </tr>
            </table>
            <table border="0" cellpadding="0" cellspacing="0" class="kuang" style="width: 150px">
                    <tr><a href="producttypeE/productManage1.aspx" target="frame2">
                      <td style="height: 21px; text-align: left; width: 154px;" id="td12" onclick="ClickEvent(this)"   class="tblBlueline"   onmouseover="this.className='tblSubDeepBlue'"   onmouseout="OutEvent(this)">
                          
                      已发布至网站</td></a>
                    </tr>
            </table>
            <table border="0" cellpadding="0" cellspacing="0" class="kuang" style="width: 150px">
                    <tr><a href="producttypeE/productManage2.aspx" target="frame2">
                      <td style="height: 21px; text-align: left; width: 154px;" id="td9" onclick="ClickEvent(this)"   class="tblBlueline"   onmouseover="this.className='tblSubDeepBlue'"   onmouseout="OutEvent(this)">
                          
                      未发布至网站</td></a>
                    </tr>
            </table>
            <table border="0" cellpadding="0" cellspacing="0" class="kuang" style="width: 150px">
                    <tr><a href="producttypeE/productManagex.aspx" target="frame2">
                      <td style="height: 21px; text-align: left; width: 154px;" id="td10" onclick="ClickEvent(this)"   class="tblBlueline"   onmouseover="this.className='tblSubDeepBlue'"   onmouseout="OutEvent(this)">
                          
                      产品回收站</td></a>
                    </tr>
            </table>
               </td></tr>
</table>
</td>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>

posted @ 2008-04-26 16:02 hongzk 阅读(303) 评论(0) 收藏举报

china_hongzk

tab控件

公告