js更换导航条状态:当在首页的,导航条上“首页”栏目状态与其他栏目不一样;当到新闻页面时,导航采上的“新闻”栏目状态与其他栏目状态不一样。使用JS来实现这个效果。
首页,在页面上定义两种状态的css,这里定义为 t1 和 t2,里面的具体CSS大家自己定义,t1为特殊状态,t2为普通状态。
然后将导航条的的所有状态的className设置为t2。
再加上以下代码:
<script language="javascript">
str=location.href;
LocalNav(str);
</script>
<script language="javascript">
// JavaScript Document
function LocalNav(str)
{
//获取页面导航菜单项的值
//str=location.href; //获取本页url地址
var s;
if(str.indexOf("?")>0)
{
arr=str.split("?");
str1 = arr[1];
if(str1.indexOf("&")>0)
{
m1=str1.split("&");
m=m1[1];
m0=m1[0];
if(m0.indexOf("s")>=0)
{
m5=m0.split("=");
s=m5[1];
}
else
{
s1=m.split("=");
s=s1[1];
if(s1[0]=="s")
{
s=s1[1];
}
else
{
if(s=="") s=1;
}
}
}
else
{
s1=str1.split("=");
s=s1[1];
if(s=="") s=1;
}
}
else
{
s=1;
}
s=parseInt(s);
le=6;
for(i=1;i<=le;i++)
{
if(i==s)
{
document.getElementById("t"+i).className="t1";
}
else
{
document.getElementById("t"+i).className="t2";
}
}
}
</script>
这样就行了
注意:s=1表示导航条的第一个栏目,s=2表示导航条的第二个栏目,……
在像新闻列表页和新闻内容这样的二级页面的链接上也要加上新闻的导航条参数,如:news.asp?id=1&s=4和newslist.asp?cat_id=5&s=4,这里的s=4表示打开这些页面时导航条上的状态应该在新闻这个上面。