Tab控件效果

原创 2007年09月19日 11:12:00
<html>
<head>
<style>
td.act{border:2 solid black; border-bottom:0}
td.dis{border:0;border-bottom:2 solid black}
</style>
</head>
<body>
<table width=500 height=200 bgcolor=#eeeeee cellspacing=0 cellpadding=0>
<tr>
 <td height=20><table width=100% style="text-align:center"  cellspacing=0 cellpadding=0>
 <tr>
  <td id=tab1 value=1 onclick="toggle(this)" class="act">red</td>
  <td id=tab2 value=2 onclick="toggle(this)" class="dis">blue</td>
  <td id=tab3 value=3 onclick="toggle(this)" class="dis">green</td>
 </tr>
 </table>
 </td>
</tr>
<tr>
 <td style="background-color:#eeeeee">
 <div id=div1 style="position:relative;top:0;left:0;width:100%;height:100%;border:2 solid black; border-top:0;color:#f00;display:block">
  11111111 111111111 11111111111</div>
 <div id=div2 style="position:relative;top:0;left:0;width:100%;height:100%;border:2 solid black; border-top:0;color:#00f;display:none">
  222222 22222222 2222222222</div>
 <div id=div3 style="position:relative;top:0;left:0;width:100%;height:100%;border:2 solid black; border-top:0;color:#0f0;display:none">
 33333333 33333333 3333333</div>
 </td>
</tr>
</table>
<script language="JavaScript">
<!--
function toggle(x){
 for(var i=1; i<=3; i++){
  var e=eval("div"+ i);
  var y=eval("tab"+i);
  if(i==x.value){
   e.style.display="block";
   y.className="act";
  }else {
  e.style.display="none";
  y.className="dis";
  }
 }
}
//-->
</script>
</body>
</html> 
版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

用回车键实现MFC对话框中TAB键控制输入焦点在控件中跳转的效果

近日在为一个数据应用写数据输入界面,大量的编辑框要想实现快速的输入就是有设计良好的符合工作流程的TAB键序。相信,不少的人在使用具有大量编辑框的程序时都有这样的想法和感概。而我这个对话框界面主要输入的...

Android自定义多TAB悬浮控件实现蘑菇街首页效果

原文:http://www.cnblogs.com/ImyFen/archive/2015/11/15/4967127.html说明: 1.viewpager不能左右滑动; 2.转载时代码略有改动...

扩展easyUI tab控件,添加加载遮罩效果

项目里要用HighChart显示图表,如果返回的数量量太多,生成图表是一个很耗时的过程。tab控件又没有显示遮罩的设置(至少本菜是没有找到), Google了一下,根据另一个兄台写的方法,拿来改造了...

安卓经典效果组件篇6——自定义底部Tab控件

最近用到了底部的tab控件,便仔细看了一下,写了一个例子,先

WPF实现Android或IOS的Tab控件效果

在手机上,我们看到干净整洁的TabControl,如下图所示: QQ的TabControl界面: 网易云的TabControl界面: 最后我用WPF实现的TabControl: ...

Android-自定义多TAB悬浮控件实现蘑菇街首页效果

因为项目的一些需求需要用到此种展现方式.  找了市面上大部分的应用. 发现BUG不少.  基本都是嵌套ScrollView 转换事件分发给listview 实现. 但是此种方案有个缺点.    在Sc...

用回车键实现MFC对话框中TAB键控件输入焦点在控件中跳转的效果

用回车键实现MFC对话框中TAB键控件输入焦点在控件中跳转的效果
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)