简单的切换效果
js中主要控制两部分
一:各个切换项的内容框
二:切换小导航的样式变化
function $(id)
{
return document.getElementById(id);
}
function setTab(con)
{
var links = $('list').getElementsByTagName('A');<!--控制切换时的样式变化-->
var myTab = $('con_'+con);
for(var i=1;i<=4; i++)
{
if(i==con)
{
links[i-1].className='on';
myTab.style.display='block';
}
else
{
$('con_'+i).style.display='none';
links[i-1].className='off';
}
}
}
<!--数组从0开始,所以此时links后的参数为i-1。但如果i从0开始,links后的参数为i即可-->
效果如下