css做的菜单，被选中状态的一个效果，很急，希望高手帮忙！！！

html-css017

css做的菜单，被选中状态的一个效果，很急，希望高手帮忙！！！,第1张

我这个只是实现你说的正在访问的文字有不同于其他文字的效果

用一个简单的js就可以

js里：

function xk(n){

for(var i=1i<=6i++){

var curB=document.getElementById("nav"+i)

if(n==i){

curB.className="active"

}else{

curB.className="none"

}

}

}

css里：加一个选中后的样式

.active{} /*he js里的curB.className="active"名称对应*/

菜单：

<ul>

<li onclick="return xk(1)" id="nav1" class="none"><a href="/">11111</a></li>

<li onclick="return xk(2)" id="nav2" class="none"><a href="/">22222</a></li>

<li onclick="return xk(3)" id="nav3" class="none"><a href="/">33333</a></li>

<li onclick="return xk(4)" id="nav4" class="none"><a href="/">44444</a></li>

<li onclick="return xk(5)" id="nav5" class="none"><a href="/">55555</a></li>

<li onclick="return xk(6)" id="nav6" class="none"><a href="/">66666</a></li>

</ul>

虽然代码可能有点麻烦 但是可以实现

不懂这儿的选中是鼠标点击还是覆盖或者是点击之后的效果,因此就都说一下:\x0d\x0a1.被点击时的效果可以用div:active{ css }\x0d\x0a\x0d\x0a2.鼠标覆盖在上面的时候可以用div：hover{ css}\x0d\x0a\x0d\x0a3.点击之后的效果，这个相对前2种有些麻烦，必须用到JS或者jquery，步骤如下：\x0d\x0a\x0d\x0aa.先给div添加一个选中的样式比如on{css}；\x0d\x0a\x0d\x0ab.然后在js中$('div').click(function{\x0d\x0a$('div').toggleClass(' ','on')\x0d\x0a})\x0d\x0a这是jquery自带的一个方法，点击div切换2个class,