Z- 색인과 관련된 CSS 메뉴/하위 메뉴

Question

내 탐색 바 CSS에 문제가 있습니다. 나는 그것을 같이 할 : http://i39.tinypic.com/28is4uw.png

그러나 이것은 내가 갖는 것입니다 : http://i40.tinypic.com/akecl5.png

유일한 방법을 내가 그것을 그런 식으로 작동하게하는 것은 사용하는 것입니다 :

.under-menu { position: relative; z-index:999; } 

하지만이 경우 submenu links이 사망합니다.

고맙습니다.

Answer 1

아니 완벽한 솔루션,하지만 적어도 일부 우리가 문제를 해결하는 것입니다

pointer-events: none; 

를 추가하지 않을 경우, IE를 지원합니다. 이 데모는 포인터 이벤트를 포함하지 않습니다. 여기

데모입니다 : 요약 CSSDesk

, 나는 (링크와 드롭 UL은 리튬의) 드롭 다운 내부의 웨이브 배경을 추가하고, 효과는 거의 두 번째와 동일 시도해보십시오. 유일한 차이점은 드롭 다운의 맨 위 부분을 LI에 추가 한 배경으로 마스킹하는 것입니다. 다른 배경이 아직 남아 있기 때문에 웨이브 배경 그림자가 표시된다는 것을 알 수 있습니다 (JS로 숨길 수 있지만 더 좋을 것입니다. 그러나 이것은 html/css 주제이기 때문에 JS를 추가하지 않습니다)

따라서 LI 요소 위로 마우스를 가져 가면 오버레이 배경이 표시됩니다. 각 li에 대해 오버레이 배경을 드롭 다운으로 추가해야합니다. (내가 완벽한 솔루션이 아니라고 말했듯이)