[JQuery] 상단풀메뉴 드롭다운 (컨텐츠 안밀림)

안냥!

아까 했던거에 이어서 상단풀메뉴 드롭다운인데 이건 컨텐츠가 안밀리는거!

z-index 사용하는거얌 ㅎㅅㅎ

밑에 아무말 가사 적어둔거 보임?

저런식으로 하는건데 아까꺼랑 큰 차이는 없고 뭐가 달라지냐면

z-index랑 position이 추가 되냐 안되냐의 차이임!

주 메뉴인 Menu < 이 시리즈에 position:releative를 추가하면댐!

.topMenu {position: relative; width: 100%; margin-bottom: 20px; text-align: center; height: 40px; } 

이런식으로

그리고 서브가 되는 sub이거에 추가를 하는데 나는 풀메뉴 드롭다운이니까 Menu에 포함된 sub의 ul에 position을 준다

이때는

.dept01 {position: absolute; top: 40px; display: none; width: 25%;  padding: 20px 0; border-bottom: 1px solid #ccc; background: #fff; }

이렇게 해야겠지?

이때! ul에 z-index값을 준다!!!

z-index: 999;  <<<이렇게!!!!

그러면 밑의 컨텐츠를 덮는 드롭다운 메뉴가 만들어진당 ㅎㅅㅎ!

요즘 트렌드가 전체 메뉴 드롭다운 방식인데 만약 li하나하나 따로따로 되는거는 li마다 개별적으로 position:absolute를 줘야겠징! z-index도 li에 줘야겠지! 잘 기억하자!

ps> 하다보니까 뭔가 오류가 있는데 바탕화면쪽으로 마우스를 보내버리면 메뉴가 안사라진당.... 모가 문제일까

(._. ) ( ._.) 나중에 방법을 찾게된다면 수정하겟음!