<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD>
<TITLE> pagecard </TITLE>
<link href="tabcard.css" rel="stylesheet" type="text/css">
<script type='text/javascript' src="tabcard.js"></script>
<style type="text/css">
</style>
</HEAD>
<body >
<div class='tab_card' id="tab1">
<ul class='menu'>
<li >菜单一 </li>
<li class='active'>菜单二</li>
<li >菜单三</li>
<li >菜单四</li>
<li >菜单五</li>
</ul>
<div class='tab_card_con'>
<div id="tab1_l1" >
<p>菜单一内容</p>
</div>
<div id="tab1_l2" >
<p>菜单二内容</p>
</div>
<div id="tab1_l3" >
<p>菜单三内容</p>
</div>
<div id="tab1_l4" >
<p>菜单四内容</p>
</div>
<div id="tab1_l5" >
<p>菜单五内容</p>
</div>
</div>
</div>
<p/>
<p/>
<p/>
<div class='tab_card' id="tab2">
<ul class='menu' >
<li>x第一新闻</li>
<li >x第二新闻</li>
<li >x第三新闻</li>
<li class='active'>x第四新闻</li>
<li>x第5新闻</li>
</ul>
<div class='tab_card_con'>
<div id="tab2_l2">
<p>注:tab2_l?? 命名方法是 1 递增 </p>
</div>
<div id="tab2_l3">
<p>xxx2</p>
</div>
<div id="tab2_l4">
<p>xxx3</p>
<p>xxx3</p>
</div>
<div id="tab2_l5">
<p>xxx4</p>
</div>
<div id="tab2_l6">
<p>xxx5</p>
</div>
</div>
</div>
<script language="javascript">
/**
*
* @param string tabId 当前标签组id
* @param string fromContendId 要加载的内容的id前缀
* @param int bindType 绑定方式 0为绑定鼠标移上效果 1为鼠标点击的效果
* @version 1.0.0
*/
//TabCard(tabId,fromContendId,bindType)
var tmpObj=new TabCard("tab1");tmpObj.initab();
var tmpObj1=new TabCard("tab2","tab2_l",1);
tmpObj1.mActiveClass ="active";
tmpObj1.mNoActiveClass ="default";
tmpObj1.mListStartNumb =2;
tmpObj1.initab();
</script>
</body>
</HTML>
css做标签页选项卡js类[有演示代码]
3星 · 超过75%的资源 需积分: 10 30 浏览量
2007-09-24
22:05:28
上传
评论
收藏 4KB RAR 举报 
pagecard.rar （5个子文件） 
tabcard.css 1KB
default.jpg 478B tabcard.js 4KB active.jpg 647B
index.html 2KB资源评论
moon&sean2013-08-14资源不错，不过不是我想要的，
xtadg2013-04-18资源不错，用着呢
hongkiton2013-04-05资源不错，不过不是我想要的，多谢楼主分享
