웹을 통해 새로운 창조를 꿈꾸는 인간 - kimdirector
www.kimdirector.co.kr Photo by unsplash.com
kimdirector
Creative Web & Mobile UX Planner & Designer


웹을 통해 새로운 창조를 꿈꾸는 인간
Humans dreaming of new creation through the web
WEBDESK
Web Standard
HOME WEBDESK Web Standard
사이드 메뉴 슬라이딩 방식-Multi-Level Push Menu
Posted by kimdirector | 2015.07.15 | Hit : 3274
목록보기이전보기
요즘 홈페이지에서 또는, 모바일 웹, 어플리케이션에서 많이 활용되도 있는 사이드 메뉴 구현방식입니다. 활용도가 높은 만큼 트렌드라고 할 수 있겠죠.


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

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


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


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

 
해당 리소스는 아래 링크에서 해당 사이트로 이동 후 다운받으시기 바랍니다.
 
해당 홈페이지에서는 활용 방식이나 설명이 자세하게 되어 있으니, 어렵지 않게 구현할 수 있습니다.
 
홈페이지에 가시면 여느 사이트와 같은 방식으로 데모도 볼 수 있으니 참고하시기 바래요.
리소스 관련된 질문은 받지 않겠습니다. 저도 아직 활용해 보지 않아서요. 관련 질문은 해당 리소스 화면에서 하시면 될 듯 해요.
Posted by kimdirector | 2015.07.15 | Hit : 3274
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
Tags
창의력 플랫 마케팅 웹기획 성격 에너지 UX 디자인 로고 인터넷 isTallk CIP 다운로드 브라우저 페이스북 UI UI 디자인 취업 디자인DB 스타일 스티브잡스 원데이몰 로고디자인 HTML5 아바타 디자인 모바일 세미나 iPad 셔터스톡 스터디 JQuery 무료 직원 스마트워치 소비자 디자이너 서체 웹디자인 폰트 사용자 모바일 포트폴리오 구글 트렌드 컨텐츠 캠페인 한국 서비스 비콘 데스크톱 11번가 아이패드 아이폰 바이러스 사회적기업 반응형 웹
Tags
네이버 웹마스터 창조 배경이미지 김수신 성형외과 CIP iPhone 디자인 모바일서비스 트렌드 글꼴 리더 폰트 스토리 일러스트 홈페이지 무료 자바스크립트 라이브러리 홈페이지 클라우드 게임 메뉴판 네이버 스마트폰 어플리케이션 애플 iOS7 구직난 inspiration 프레젠테이션 천재 셔터스톡 UI 페이스북 모바일 웹디자인 단축키 UX 맥 무료 오픈소스 앱 네비게이션
Category Cloud
About us Review Portfolio Design Review 
Leaders Story Mobile UXD IT Information
Web Identity Everyday Story Mobile Life
Webdesign Report Web Standard Homepage Work
Web Plan Report Practical Use Tip Design Inspiration
Dowmload Review Recommend Site
Search
Contact us
Phone : 010-8555-0503
E-mail : kimdirector@gmail.com