当li悬停或活动时更改ul背景

Question

我正在研究这个新的wordpress主题，现在我有以下问题。如果你看这里：http://www.client-szs.nl/fatih你会看到主菜单。如果我点击或悬停，比方说，博客，我想要更改ul背景并一直移动到博客这个词。这也适用于菜单中的其他项目。所以每个李都有不同的背景位置。我到处寻找，但似乎无法找到一个好的解决方案。

先谢谢，

跋

Answer 1

更简单的方法，如果您愿意，只需使用css，请参阅DEMO http://jsfiddle.net/yeyene/DZRUu/

使用这些css，您的活动菜单将在DEMO中更改。

.mainnav ul {
    background:#D11F28;
    background-position: -730px 0px;
    background-repeat: no-repeat;
    border: 0px solid;
    min-height: 48px;
    margin: 0px;
    padding: 0px 8px 0px 8px;
    width:100%;   
}
.mainnav ul li {
    font-family: 'Rokkitt', serif;
    display: inline-block;
    list-style-type: none;
    font-size: 23px;
    line-height: 30px;
    padding:9px 5px;
    width: auto;
    margin-right: 3%;   
}
.mainnav ul li a{
    text-decoration:none;
    color:#fff;      
}
.mainnav ul li.current_page_item a{
    text-decoration:none;
    color:#D11F28;    
}
.mainnav ul li.current_page_item{
    background:#F2F2F2;    
}

Answer 2

您可以使用jquery：

进行此操作

$('li').hover(function() { //mouseover
     $('ul').css('background', '#000');
}, function() { //mouseout
     $('ul').css('background', '#fff');
});

Obs：代码未经过测试。