05 - 22 검은사막 메인페이지 마크업 (4) - 메뉴 제이쿼리 (2)

 

* 사이즈를 조금 줄이면 버튼이 내려가는 문제 ( 미디어쿼리로 반응형 분기 잡아주기 작업 필요 )

 

 

 

*1330px -> 다운로드 메뉴가 더 보기 안에 병합

 

기존에 다운로드, 고객센터의 메뉴가 사라지고

추가로 더보기 메뉴가 추가되면서 그 안에 또 다른 메뉴가 생기는 식 ( 아예 레이아웃이 새로 추가되고 바뀜 )

 

일단 유튜브나 구글링 없이

어떻게 짤지 고민 후 어떻게든 해보고나서 그 후 판단 ( 새로운 형식의 반응형 )

 

어떻게 짜볼까?

 

 

:: 반응형 테스트 ( .main_ul > li:child 로 하면 적용이 안되었다가 앞에 클래스를 하나 더 붙여주니 다시 스타일 적용됨 )

 

 

 

메뉴에 히든메뉴 하나 추가하는 방식으로?

html 마크업 추가

 

 

이런 식으로 반응형 대비 더보기 히든 버튼을 추가하고 토글로 들어가는 메뉴들 싹 다시 추가 ( ul > li 형식으로 )

 

 

 

 

 

 

 

히든메뉴의 서브메뉴 제작. 대략 css 입혀주고

 

 

제이쿼리 추가. 더보기 히든 서브메뉴 슬라이드 토글. 

 

 

 

https://github.com/wonpoem/blackdesert/tree/master/blackdesert

GitHub - wonpoem/blackdesert: blackdesert mark up study

 

 

https://rkqtlr15159.cafe24.com/blackdesert/

검은사막