请大神帮我解答
我在做一个网页,想用到选项卡
效果图:
代码是:
<div class="menu">
<ul>
<li><a href="#pic" id="current" >相册</a></li>
<li><a href="#video">视频</a></li>
<li><a href="#message">动态</a></li>
</ul>
</div>
<div class="boxmain">
<div class="pic clearfix">
<div >123</div>
<div>123</div>
</div>
<div class="video clearfix">
<div>456</div>
<div>456</div>
</div>
<div class="message clearfix">
<div>789</div>
<div>789</div>
</div>
</div>
就是链接对应的每个div里面,又有很多的div,该怎么修改js才能实现选项卡的效果。
附上视频里的js代码:
function $(id){
return typeof id==='string'?document.getElementById(id):id;
}
window.onload=function(){
//获取鼠标滑过或点过的标签和要切换的内容的元素
var titles=$('notice-tit').getElementsByTagName('li');
divs=$('notice-con').getElementsByTagName('div');
if(titles.length!=divs.length)
return;
//遍历title下的所有li
for var i=0;i<titles.length;i++){
titles[i].id=i;
titles[i].onclick=function(){
//清楚所有li上的class
for(var j=0;j<titles.length;j++){
titles[j].className='';
divs[j].style.display='none';
}
//设置当前为高亮显
this.className='select';
divs[this.id].style.display='block';
}
}
}
请大神求救,