"내비게이션 드로워"의 두 판 사이의 차이

 
(사용자 2명의 중간 판 8개는 보이지 않습니다)
1번째 줄: 1번째 줄:
==개요==
==개요==
;side navigation menu, side navigation, navigation drawer; nav drawer; drawer
;side navigation menu, side navigation, navigation drawer; nav drawer; drawer
;측면 내비게이션 메뉴, 사이드 내비게이션, 내비게이션 드로워; 내브 드로워; 드로워
;측면 내비게이션 메뉴, 사이드 내비게이션, 내비게이션 드로워, 네비게이션 드로어; 내브 드로워; 드로워
* [[내비게이션 UI]] 중 하나
* [[내비게이션 UI]] 중 하나
* [[사이드바]]의 변형판
* 화면 측면에서 떠서 밀려들어오는 메뉴  
* 화면 측면에서 떠서 밀려들어오는 메뉴  
 
* 주로 폭이 좁은 경우(모바일 화면), 토글 버튼으로 보이기/숨기기를 제어한다.
* 폭이 넓은 경우에는 고정된 사이드바로, 폭이 좁은 경우에만 이것을 적용하는 경우가 많다.
<img src='https://storage.googleapis.com/material-design/publish/material_v_10/assets/0B7WCemMG6e0VaDhWUXJTTng4ZGs/patterns_navigation_drawer.png' style='width:300px' />
<img src='https://storage.googleapis.com/material-design/publish/material_v_10/assets/0B7WCemMG6e0VaDhWUXJTTng4ZGs/patterns_navigation_drawer.png' style='width:300px' />


12번째 줄: 15번째 줄:
* [[메뉴]]
* [[메뉴]]
* [[CSS 내비게이션 드로워]]
* [[CSS 내비게이션 드로워]]
* [[사이드바]]


==참고 자료==
==참고==
* http://www.w3schools.com/howto/howto_js_sidenav.asp
* http://www.w3schools.com/howto/howto_js_sidenav.asp
* https://material.io/guidelines/patterns/navigation-drawer.html
* https://material.io/guidelines/patterns/navigation-drawer.html


[[분류: GUI]]
[[분류: 내비게이션 드로워]]
[[분류: 메뉴]]

2020년 2월 8일 (토) 16:32 기준 최신판

1 개요[ | ]

side navigation menu, side navigation, navigation drawer; nav drawer; drawer
측면 내비게이션 메뉴, 사이드 내비게이션, 내비게이션 드로워, 네비게이션 드로어; 내브 드로워; 드로워
  • 내비게이션 UI 중 하나
  • 사이드바의 변형판
  • 화면 측면에서 떠서 밀려들어오는 메뉴
  • 주로 폭이 좁은 경우(모바일 화면), 토글 버튼으로 보이기/숨기기를 제어한다.
  • 폭이 넓은 경우에는 고정된 사이드바로, 폭이 좁은 경우에만 이것을 적용하는 경우가 많다.

<img src='https://storage.googleapis.com/material-design/publish/material_v_10/assets/0B7WCemMG6e0VaDhWUXJTTng4ZGs/patterns_navigation_drawer.png' style='width:300px' />

2 같이 보기[ | ]

3 참고[ | ]

문서 댓글 ({{ doc_comments.length }})
{{ comment.name }} {{ comment.created | snstime }}