jquery當前菜單項更改顏色問題

默認a:link和a:visited background-color是透明的，顏色是黑色。然後，a：hover與背景指定爲黑色，顏色爲白色。這很好。jquery當前菜單項更改顏色問題

這裏是問題：我插入jQuery腳本執行背景和顏色的變化，在我的情況下設置背景黑色和顏色是白色的 - 與a:hover相同。該腳本正在執行想要的操作，但文本的顏色保持黑色。任何幫助？

這裏是代碼：

<ul id="subnav"> 
    <li><a href="http://127.0.0.1:4001/wbdemo/pages/abc.php" class=」red」 onclick=」selected(this)」><h99>Home<h99/></a></li> 
    <li><a href="http://127.0.0.1:4001/wbdemo/pages/asd.php"><h99>Home</h99></a></li> 
    <li><a href="http://127.0.0.1:4001/wbdemo/pages/rtz.php"><h99>Home</h99/></a></li> 
    <li><a href="#"><h99>Home</h99/></a></li> 
    <li><a href="#"><h99>Home</h99/></a></li> 
</ul> 

<script type="text/javascript"> 
$(document).ready(function(){ 
    $('#subnav a').each(function(index) { 
     if(this.href.trim() == window.location) 
      $(this).addClass("selected"); 
    }); 
}); 
</script>

ul 
{ list-style-type: none; 
    margin:0; 
    padding:0; 
    overflow: hidden; 
} 

ul a:link, ul a:visited 
{ display: block; 
    width: 240px; 
    background-color: tranparent; 
    text-align: right; 
    text-transform: uppercase; 
    text-decoration: none; 
    height: 40px; 
    color: #000000 
} 

ul a:hover, .selected 
{ background-color: #000000; 
    color: #ffffff 
}

來源

2012-08-10 Matti

拆分最後CSS類嘗試爲兩個：

ul a:hover 
{ 
    background-color: #000000; 
    color: #ffffff; 
} 

.selected 
{ 
    background-color: #000000; 
    color: #ffffff !important; 
}

或者，簡單的，只是有!important添加到最後一行：

ul a:hover, .selected 
{ 
    background-color: #000000; 
    color: #ffffff !important; 
}

來源

2012-08-10 21:31:17 Vlad

謝謝！按原樣工作！ :) – Matti 2012-08-10 21:35:19

與

$(this).css('color','coloryouwant')

來源

2012-08-10 21:23:44

有了這個，每個菜單項都變成了白色，不僅僅是選中的。 – Matti 2012-08-10 21:26:43

jquery當前菜單項更改顏色問題

回答

相關問題