웹을 통해 새로운 창조를 꿈꾸는 인간 - kimdirector
www.kimdirector.co.kr Photo by unsplash.com
kimdirector
Creative Web & Mobile UI/UX Planner and Designer
Humans dreaming of new creation through the UI/UX



WEBDESK
Web Standard
HOME WEBDESK Web Standard
사이드 메뉴 슬라이딩 방식-Multi-Level Push Menu
Posted by kimdirector | 2015.07.15 | Hit : 3824
모바일웹 어플리케이션 사이드 메뉴
목록보기이전보기
요즘 홈페이지에서 또는, 모바일 웹, 어플리케이션에서 많이 활용되도 있는 사이드 메뉴 구현방식입니다. 활용도가 높은 만큼 트렌드라고 할 수 있겠죠.


우측의 오픈메뉴 버튼을 클릭하면 좌측에 사이드메뉴 출력 가능한 리소스입니다.
3단계까지 펼쳐지는 사이드 메뉴이고 하부메뉴로 이동할 때마다 이전 메뉴 위에 겹쳐져서 출력되는 형태입니다.
 
총 3가지로 출력되는 방식이며, 모바일 웹에서 또는 어플리케이션, 모두 사용 가능한 리소스입니다.
참고하여 응용하면 멋진 홈페이지가 될 수 있을 것 같습니다.
 
총 3가지 타입이 있습니다.
 

상위레벨의 메뉴가 밀려나는 형태


상위메뉴를 덮고 백링크가 출력되는 형태


위의 두가지를 합친 형태가 있습니다.

 
해당 리소스는 아래 링크에서 해당 사이트로 이동 후 다운받으시기 바랍니다.
 
해당 홈페이지에서는 활용 방식이나 설명이 자세하게 되어 있으니, 어렵지 않게 구현할 수 있습니다.
 
홈페이지에 가시면 여느 사이트와 같은 방식으로 데모도 볼 수 있으니 참고하시기 바래요.
리소스 관련된 질문은 받지 않겠습니다. 저도 아직 활용해 보지 않아서요. 관련 질문은 해당 리소스 화면에서 하시면 될 듯 해요.
Posted by kimdirector | 2015.07.15 | Hit : 3824
Origin http://tympanus.net/codrops/2013/08/13/multi-level-push-menu/
Tags 모바일웹 어플리케이션 사이드 메뉴
Trackback http://www.kimdirector.co.kr/bbs/zerotb.php?id=webaccessibility&no=116

COMMENT
목록보기 이전보기
WEBDESK
Design Review
Webdesign Report
Web Plan Report
Design Inspiration
Mobile Life
Web Standard
Recommend Site
Insight Story
Best View Contents
Category Cloud
About us Review Portfolio Design Review Leaders Story Mobile UXD  IT Information Web Identity Everyday Story Mobile Life Webdesign
Web Standard Homepage Work Web Plan Report Practical Use Tip Inspiration Download Recommend Site
Tags
트렌드 로고디자인 업무효율 Parallax Scrolling 유저인터페이스 모바일 스마트워크 모바일 리소스 전략 IT BIP 솔루션 디자인 웹디자인 직장생활 일러스트 데이비드리포트 브랜드 아이덴티티 구성요소 랜딩페이지 직장생활 에버노트 Design 리더십 타블렛 디자인 홈페이지 월페이퍼 개발자 Blueprint 홈페이지 스케치 전용서체 습관 구글 에너지 커리어