有间隔带“更多”字样的选项卡

2024-09-05 12:20:17

字体：大中小

来源：转载

供稿：网友

有间隔空隙带“更多”字样的选项卡，完全是由JS控制的，内容也写在JS的数组里，这样便于从外部调用JS文件，这样做有优点也有缺点，看你的实际需求了。

<title>有间隔空隙带“更多”字样的选项卡</title><style> td {font-size:9pt;}.mousehand{cursor:hand;}.titletable{padding-left:5px;background-color:#E9E9E9; }	table.TabBarLevel1{}table.TabBarLevel1 td{ border:1px solid #454545; height:20px; background-color:#E1E1E1;}table.TabBarLevel1 td.Selected{ border-bottom-width:0px; background-color:#ffffff;}table.TabBarLevel1 td.Black{ border-left-width:0px; border-top-width:0px; border-right-width:0px; background-color:#FFFFFF;}table.Content{ border:1px solid #454545; border-top:none;}</style><table width="600" border="0" cellspacing="0" cellpadding="0">  <tr>    <td><table width="100%"  border="0" cellspacing="0" cellpadding="0" class="TabBarLevel1" id="TabPage1">      <tr align="center">        <td width="130" id="imageTab1" valign="middle" class="mousehand" onclick="javascript:switchTab('TabPage1','imageTab1','源码爱好者欢迎您到来！','image');">网站介绍</td>        <td width="7" class="Black"> </td>        <td width="80" id="imageTab2" valign="middle" class="mousehand" onclick="javascript:switchTab('TabPage1','imageTab2','本栏提供精品网页特效代码','image');">网页特效</td>        <td width="7" class="Black"> </td>        <td width="80" id="imageTab3" valign="middle" class="Selected mousehand" onclick="javascript:switchTab('TabPage1','imageTab3','网友的留言','image');">最新留言</td>        <td width="7" class="Black"> </td>        <td width="" align="right" class="Black">更多  </td>      </tr>    </table>      <table width="100%"  border="0" cellpadding="0" cellspacing="0" class="Content">        <tr>          <td height="110"><div id="divimagelist_all"> 正在加载...</div></td>        </tr>      </table></td>  </tr></table><script language="javascript"> function switchTab(tabpage,tabid,action,type){	var oItem = document.getElementById(tabpage);   	for(var i=1;i< 4;i++){		var x = document.getElementById(type + 'Tab' + i);			x.className = "mousehand";	}		document.getElementById(tabid).className = "Selected";	divimagelist_all.innerHTML = type+'_'+action;}</script>

上一篇：完全用Js输出的Tab选项卡

下一篇：仿门户网腾讯的头部导航菜单

学习交流

如何查找有故障的配件

如何查找有故障的配件...

热门图片

猜你喜欢的新闻

猜你喜欢的关注