菜單子菜單懸停效果

我在我的網站上有以下幾行 - http://codepen.io/anon/pen/LhDnu/創建一個側邊欄菜單。菜單子菜單懸停效果

當用戶將鼠標懸停在父項上方時，會出現一個子菜單，其中包含子項鍊接。

但是，當鼠標移過來選擇其中一個子鏈接時，它將刪除列出的子菜單項。

如何修改上面的codepen，以便它允許用戶選擇其中一個子菜單項？

問題是子菜單太遙遠了，所以當你將鼠標移向它時，你不再徘徊在父項上。根據你想要看的方式，你可以將子菜單移近或保持原樣，但在它們之間創建一個透明的「橋」，以便懸停效果不會消失。 – John

感謝您的迴應約翰。你能否給我提供一個我如何去創建一個透明橋樑的例子？ – user1752759

這將是一個特別繁瑣的修復方法，很容易導致它自己的可用性問題，但它基本上是一個「絕對」的塊，沒有背景色（或者不透明度），有些陷入了缺口。您可以在頂層或子菜單上創建一個僞元素來實現它。 – John

沒關係。這是解決方案 - http://codepen.io/anon/pen/LzpyK/。

2014-04-01 01:10:37 user1752759

這是給你一個工作代碼，CSS中的下拉菜單中嘗試用display:none & display:block不工作與opacity

2014-03-31 22:48:00 rsm23

謝謝你的迴應Saif。側邊欄需要圍繞它的填充空間以符合網站的視覺一致性，這可能是爲什麼當鼠標懸停在子項上時我仍然得到相同的結果。使用'display：none'，我也失去了逐漸的過渡效果。 – user1752759

回答