반응형
이게 얼마나 쉽냐면
이것저것 HTML5 SLIDE 메뉴랍시며 적용해보다 매번 헛걸음만 하다 이 오픈 소스 한방에 모든게 다 해결되었기 때문이다.
왼쪽에서 오른쪽 또는 그 반대방향 푸시메뉴도 되고 레이어처럼 메뉴가 위로 올라오기도 할 수 있고, 아래에서 위에서 아래로도 되는 매우 강력한 HTML5 SLIDE MENU라 할 수 있겠다.
원본 출처는 다음과 같다.
https://tympanus.net/codrops/2013/04/17/slide-and-push-menus/
데모는 여기서 확인이 가능하다.
https://tympanus.net/Blueprints/SlidePushMenus/
다만 한가지 마음에 안드는건 메뉴가 그냥 쌩 버튼이라 좀 손봐야 한다란 부분이다.
또 어려운 중생들을 위해 수정된 HTML을 공유하니 있는 힘껏 경배하라
음하하하하
<div id="showLeftPush" style="position:absolute; z-index:100; padding:24px 0 0 20px;"><img src="../images/slideMenu.png" /></div>
흔히 사용되는 三 아이콘이 slideMenu.png라 보면 되고 이 위치가 버튼의 좌측에 배치된다 보면 된다.
버튼을 100%로 만드는건 알아서 -_-
반응형
'모바일 & 앱' 카테고리의 다른 글
| 웹에서 스크린샷을 찍은 후 파일로 저장하기 (0) | 2017.09.06 |
|---|---|
| 잡다한 jQuery Tip 각종 컨트롤 연동 이벤트 등등 (0) | 2017.08.18 |
| 귀찮은 mssql 개체 탐색기 (쿼리분석기)에서 시스템개체 없애는 방법 (0) | 2017.08.04 |
| 클래시오브클랜 장인기지 꿀팁 (0) | 2017.07.28 |
| jQuery checkbox 일괄체크시 클릭 이벤트 주는 방법 trigger (0) | 2017.07.21 |
