用class来控制的选项卡.支持N个同时在一个页面
不过好像要用的话要传递很多参数.不是很好.不过个人使用到是不错的选择.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link href="css/css.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
function SetTab(id,tid,tag,ttag,cs,tcs){
var a = document.getElementById(tid).getElementsByTagName(ttag);
var b = document.getElementById(id).getElementsByTagName(tag);
function tab(i){
a[i].onclick = function(){none();b[i].style.display = "";a[i].className = cs};
}
for(i=0;i<a .length;i++){
tab(i);
}
function none(){
for(i=0;i<a.length;i++){
b[i].style.display = "none";
a[i].className = tcs;
}
}
none();
b[0].style.display = "";
a[0].className = cs;
}
window.onload = function(){SetTab("tab","tab2","ul","li","abc","bcs")};
</script>
</a></script></head>
<body>
<ul id="tab2">
<li>广告传播</li>
<li>广告传播2</li>
<li>广告传播3</li>
</ul>
<div id="tab">
<ul>
<li>
<img src="test_img.gif" />
<h3><a href="">广告传播</a></h3>
<span>几十年，媒体帮助传达了广告信息。广告牌带来了巨大醒目的广告形式，广播以平静对话的方式告诉你广告内容。而对于电视媒体，广告主可以利用的广告形式多种多样，但他们似乎总爱用30秒的广告...广告主可以利用的广告形可以利用.</span>
</li>
</ul>
<ul>
<li>
<img src="test_img.gif" />
<h3><a href="">广告传播2</a></h3>
<span>几十年，媒体帮助传达了广告信息。广告牌带来了巨大醒目的广告形式，广播以平静对话的方式告诉你广告内容。而对于电视媒体，广告主可以利用的广告形式多种多样，但他们似乎总爱用30秒的广告...广告主可以利用的广告形可以利用.</span>
</li>
</ul>
<ul>
<li>
<img src="test_img.gif" />
<h3><a href="">广告传播3</a></h3>
<span>几十年，媒体帮助传达了广告信息。广告牌带来了巨大醒目的广告形式，广播以平静对话的方式告诉你广告内容。而对于电视媒体，广告主可以利用的广告形式多种多样，但他们似乎总爱用30秒的广告...广告主可以利用的广告形可以利用.</span>
</li>
</ul>
</div>
</body>
</html>