일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- 솔루션
- #cgimall
- #동영상
- 웹솔루션
- jquery
- #image
- happycgi
- CSS
- 쇼핑몰
- #뉴스
- 해피CGI
- #해피CGI
- #쇼핑몰
- 사이트제작
- javascript
- #홈페이지
- php
- #홈페이지제작
- 게시판
- #웹솔루션
- CGIMALL
- 해피씨지아이
- 홈페이지제작
- #솔루션
- #CSS
- #jQuery
- #happycgi
- #업종별
- #이미지
- 홈페이지
- Today
- Total
웹솔루션개발 22년 노하우! 해피CGI의 모든것
[해피CGI][cgimall] Smart Sticky Header Hamburger Navigation Plugin - jQuery mhead 본문
웹프로그램밍 자료실/JAVA 자료
[해피CGI][cgimall] Smart Sticky Header Hamburger Navigation Plugin - jQuery mhead
해피CGI윤실장 2021. 7. 2. 09:32모바일용 웹페이지를 제작할 때
상단 부분에 세줄(햄버거)이 화면을 스크롤(스와이프) 할때
숨기거나, 표시해주는 jQuery 플러그인입니다.
스크롤을 내려보면 상단에 세줄 모양의 바가 화면 스크롤을 따라서 내려오거나,
스크롤을 빠르게 내리는 경우 상단의 바가 화면에서 사라집니다.
햄거버 모양의 아이콘 외에 로고, 그 외의 아이콘 들이 추가된 예제입니다.
햄버거바를 클릭하면 메뉴 화면이 열리면서
햄버거 모양의 아이콘이 닫기를 의미하는 아이콘으로 변경시 에니메이션을 주는 예제입니다.
그 외에도 햄버거 바의 위치를 좌에서 우로 조절을 한다거나,
로고를 포함한다거나,
아래 그림 처럼 검색폼이 포함된 예제가 있습니다.
'웹프로그램밍 자료실 > JAVA 자료' 카테고리의 다른 글
[해피CGI][cgimall] ViewScroller.js : jQuery Fullpage website Scrolling (0) | 2021.07.06 |
---|---|
[해피CGI][cgimall] Javascript Smoke Effect (0) | 2021.07.05 |
[해피CGI][cgimall] 화면 스크롤에 따라 움직이는 이미지 효과 (0) | 2021.06.11 |
[해피CGI][cgimall] Images grid jQuery plugin (0) | 2021.06.07 |
[해피CGI][cgimall] Minimal Youtube/Vimeo Modal Plugin For jQuery - modal-video (0) | 2021.06.04 |
Comments