Line 32: | Line 32: | ||
margin: 0.3em 0 0 42px; | margin: 0.3em 0 0 42px; | ||
} | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
}} | }} | ||
Drawer는 작은 화면에서 효과적으로 자주 사용하는 기능 및 정보를 표시할 수 있는 패턴이다. 주로 현재 페이지를 어느 정도 유지한 채 같은 화면에 숨겨진 페이지를 띄워 보여준다. | Drawer는 작은 화면에서 효과적으로 자주 사용하는 기능 및 정보를 표시할 수 있는 패턴이다. 주로 현재 페이지를 어느 정도 유지한 채 같은 화면에 숨겨진 페이지를 띄워 보여준다. | ||
Line 56: | Line 44: | ||
* 숨겨진 페이지가 표시되어도 현재 페이지를 살짝 유지함으로써, 일시적인 호출이며 마지막 위치가 항상 유지되고 있다는 느낌을 준다. | * 숨겨진 페이지가 표시되어도 현재 페이지를 살짝 유지함으로써, 일시적인 호출이며 마지막 위치가 항상 유지되고 있다는 느낌을 준다. | ||
+ | |||
+ | == Drawer(Slide Hidden Menu) == | ||
=== iPhone_Yahoo === | === iPhone_Yahoo === | ||
{{#Widget:Vimeo|id=95772659|width=300|height=455}} | {{#Widget:Vimeo|id=95772659|width=300|height=455}} | ||
− | |||
− | |||
− | |||
=== iPhone_Gmail === | === iPhone_Gmail === | ||
Line 91: | Line 78: | ||
{{#Widget:Vimeo|id=95762142|width=300|height=455}} | {{#Widget:Vimeo|id=95762142|width=300|height=455}} | ||
--> | --> | ||
− | + | ||
== Drawer(Overay Hidden Menu) == | == Drawer(Overay Hidden Menu) == | ||
Line 119: | Line 106: | ||
{{#Widget:Vimeo|id=95774030|width=300|height=455}} | {{#Widget:Vimeo|id=95774030|width=300|height=455}} | ||
--> | --> | ||
− | + | ||
== Insert Hidden Menu == | == Insert Hidden Menu == | ||
Drawer는 작은 화면에서 효과적으로 자주 사용하는 기능 및 정보를 표시할 수 있는 패턴이다. 주로 현재 페이지를 어느 정도 유지한 채 같은 화면에 숨겨진 페이지를 띄워 보여준다.
숨겨진 페이지를 표시하는 방식에서 여러가지 트랜지션이 사용되는데 Slide방식이 주로 사용되며, 최근 Overlay/Insert 등의 트랜지션을 사용한 사례도 많아지고 있다.
Drawer를 호출하는 버튼은 주로 일명 '햄버거'로 불리는 아이콘의 버튼이 사용된다.