CSS ul li，從第二級懸停

Question

請幫助改善菜單。

請檢查我的示例http://jsfiddle.net/fantill/SBkRk/

現在它可以從菜單的第一級懸停，但是我希望它可以從第二級懸停並保持當前的懸停效果。 （ 顯示第一級和第二級並隱藏其余的）

我很累，但是我找不到辦法，由於position: relative, absolute問題，懸浮設置似乎只能從第一級開始工作。

非常感謝您的建議。

現在就像

--------------------
| 1st | 2nd |  3rd |
| ----|-------------
|     |     |
|-----|-----|
|     |
-------

我希望它像這樣

1st and 2nd level are always visible
-------
| 1st |
| ----|------
| |2nd| 3rd |
|-----|------
| |2nd|
-------

Answer 1

我已經更新了您的jsfiddle，使其可以按照您的要求工作。 這是更新的CSS：

.MM ul {
  position:absolute;
    list-style: none;
    margin: 0;
    padding: 0;
    z-index: 2;
}
.MM ul li:hover > ul {
    display:block;
}
.MM ul li {
    position: relative;
  display: block;
}
.MM ul ul {
    display:none;
    position: relative;
    white-space: nowrap;
    top: 0;
    left:0;
}
.MM ul ul ul {
  position: absolute;
    top: 0px;
    left: 100%;
}