chunpeng 发表于 2013-2-7 15:32:55

JS实现简单TAB效果

<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><style type="text/css"> a {color:#000000;text-decoration:none;}   #header {float:left;width:100%;background:#D3D3D3;font-size:93%;   line-height:normal;}#header ul {margin:0;padding:0px;list-style:none;}#header li {float:left;background:#DCE1EF; border:solid 1px #8EA2C2; margin-left:2px; padding:0px;}#header a {display:block; padding:5px 15px 4px;}#header .current { background:#FFFFFF; border-left:solid 1px #8EA2C2; border-top:solid 1px #8EA2C2; border-right:solid 1px #8EA2C2; border-bottom:solid 0px #8EA2C2; }#header .current a{ padding-bottom:5px;}.content {margin-top:10px;}.content .contentHeader {background-color:#BCC7E0;border:solid 1px #4B66A5;font-weight:bold;} .content .contentMain { border-left:solid 1px #4B66A5; border-top:solid 0px #4B66A5; border-right:solid 1px #4B66A5; border-bottom:solid 1px #4B66A5;}</style><script type="text/javascript">function change_option(number,index){ for (var i = 1; i <= number; i++) {      document.getElementById('current' + i).className = '';      document.getElementById('content' + i).style.display = 'none'; }document.getElementById('current' + index).className = 'current';document.getElementById('content' + index).style.display = 'block';}</script>CSS中的滑动门技术</head> <body>   
   
[*]唐诗三百首   
[*]宋词精选   
[*]明清小说
页: [1]
查看完整版本: JS实现简单TAB效果