求助，选项卡如何实现分两栏（行）？ [复制链接]

id="tabhead" 和id="tabcontent"重复了，一个页面不能出现两个相同的id，如果多个选项卡，重新命名id保证唯一性
比如第二个选项卡代码里面的id="tabhead" 和id="tabcontent"分别改为id="tabhead_1" 和id="tabcontent_1"
<script type="text/javascript">
tabs("tabhead_1","tabcontent_1","onmouseover");
</script>
这里id也同步更换

[b]回复 [url=http://bbs.pageadmin.net/showtopic-28829.aspx#110832]2楼[color=Olive]xiyou[/color]的帖子[/url][/b]

          首先非常感谢xiyou百忙中抽时间两次回到我的这个问题。
           测试地址：[url]http://w156383.s22.chinaccnet.cn/[/url]
         按您的方法进行了修改，打开第二栏目能显示出来，如果下图一
      
          但当鼠标移动到 选项卡第二栏目框社发科技1这一行，就自动收缩，再也打不开。而且第二栏目鼠标滑过也没反应。



     按您的方法修改如下：

</script>
<style type="text/css">
.tabheadstyle{clear:both;height:20px;overflow:hidden;}
.tabheadstyle dd{float:left;width:100px;height:20px;border:1px solid #cccccc;text-align:center;margin-right:5px}
.tabheadstyle dd.current{background-coloreeeeee;} /* 当前选项卡标题样式，默认名：current */
.tabcontentstyle dd{border:1px solid #cccccc;padding:10px;display:none;}
</style>

<dl id="tabhead"  class="tabheadstyle">
<dd>政策法规1</dd>
<dd>科技计划2</dd>
<dd>科技条件3</dd>
<dd>高新技术5</dd>
<dd>农村科技6</dd>
<dd>农村科技7</dd>
</dl>
<dl id="tabcontent"  class="tabcontentstyle">
<dd>{paodel}1,132,316,,,_self,5,50,150,150{/paodel}</dd>
<dd>{paodel}1,132,509,,,_self,5,50,150,150{/paodel}</dd>
<dd>{paodel}1,132,414,,,_self,5,50,150,150{/paodel}</dd>
<dd>内容5</dd>
<dd>内容6</dd>
<dd>内容7</dd>
</dl>
<script type="text/javascript">
tabs("tabhead","tabcontent","onmouseover");
//tabs方法的简化调用（3个必填参数），前两个参数分别为标题和内容区的id，第三个参数可选onmouseover或onclick
//完整参数调用写法（6个参数）： tabs("tabhead","tabcontent","dd","dd","current","onmouseover")
</script>

<style type="text/css">
.tabheadstyle{clear:both;height:20px;overflow:hidden;}
.tabheadstyle dd{float:left;width:100px;height:20px;border:1px solid #cccccc;text-align:center;margin-right:5px}
.tabheadstyle dd.current{background-coloreeeeee;} /* 当前选项卡标题样式，默认名：current */
.tabcontentstyle dd{border:1px solid #cccccc;padding:10px;display:none;}
</style>

<dl id="tabhead_1"  class="tabheadstyle">
<dd>社发科技1</dd>
<dd>科技成果2</dd>
<dd>科技人才3</dd>
<dd>实验动物4</dd>
<dd>科技奖励5</dd>
<dd>自科基金6</dd>
</dl>
<dl id="tabcontent_1"  class="tabcontentstyle">
<dd>{paodel}1,132,323,,,_self,5,50,150,150{/paodel}</dd>
<dd>{paodel}1,132,425,,,_self,5,50,150,150{/paodel}</dd>
<dd>内容3</dd>
</dl>
<script type="text/javascript">
tabs("tabhead_1","tabcontent_1","onmouseover");
//tabs方法的简化调用（3个必填参数），前两个参数分别为标题和内容区的id，第三个参数可选onmouseover或onclick
//完整参数调用写法（6个参数）： tabs("tabhead_1","tabcontent_1","dd","dd","current","onmouseover")
</script>

这个代码很实用,以后可以拿来学习下.

按您的方法，调试到，第二栏能显示了，但不能实现滑动鼠标切换，需要点击才能切换。http://w156383.s22.chinaccnet.cn/

tabs("tabhead_1","tabcontent_1","onclick");
onclick改为onmouseover

非常感谢，问题解决

好贴留名

实用,好好学习.

实用,好好学习.

这些代码是写到哪个文件下面的，我用了一个模板有调用 ，但是标题我想自己改，但是找不到文件在哪里

好东西

好东西，收藏下！~！~