菜單項懸停效果和懸停子列表

Question

我有菜單項懸停效果的問題。

起初，我這裏有四象： http://www.upload.ee/image/3408064/abi.png

這是WordPress站點並生成該菜單由WordPress的菜單管理。

在第一張圖片中，您可以在左側看到菜單。 灰色大寫項目是主要項目，通過點擊它們出現藍色文本和白色背景的子列表。

懸停子列表項會像在第二圖像（出現另一個子列表）

這裏談到的問題的一部分。當我將光標移動到出現的子列表時，父項目懸停效果消失，就像在第三個圖像中一樣。

當我移動到子列表時，我想讓父項懸停效果留下來。 像去年的圖片

這裏是我的子表apperaing當前腳本盤旋而父子列表項：

jQuery(function() { 
    jQuery('.left-sidebar li li').hover(function() { 
     jQuery(this).children('ul').slideDown(1); 
    }, function() { 
     jQuery(this).children('ul').fadeOut(1); 
    }); 
}); 

這裏是第一子appearence主要項目點擊動作腳本：

jQuery(function() { 
    jQuery('.left-sidebar li').click(function() { 
     jQuery(this).children('ul').slideDown(300); 
    } 
}); 

這裏是jsfiddle：jsfiddle.net/TBRgu一些背景風格丟失，但沒關係。

Answer 1

現場演示：http://jsfiddle.net/TBRgu/2/

更改此：

.left-sidebar .box li li a:hover 

要這樣：

.left-sidebar #menu-kutsemeistrivoistlused > li > ul > li:hover > a 

改變寬度如下：

.left-sidebar .box li li li a{ 
    background: none; 
    padding-left: 4px; 
    width: 186px; /* changed from 165px */ 
    border:0; 
}