일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- transform
- animate
- margin
- 레이아웃
- form
- css selector
- navbar
- setTimeout
- EventListner
- position : fixed
- input
- hover
- TRANSITION
- 이벤트 버블링
- 밀리초
- CSS
- bootstrap
- togle
- Position
- float : left
- vw
- z-index
- display:none
- val()
- JQuery
- absolute
- sass
- Carousel
- css animation
- scss
- Today
- Total
목록navbar (2)
Simple Is Best
이번 포스팅에서는 페이지 상단에 위치해있는 메뉴를 클릭했을 때 내려오는 navbar에 대해서 알아보도록 하겠습니다. [click 이전] [click 이후] navbar 클릭시 애니메이션 추가 우선 바로 이전 포스팅에서 다룬 모달창 UI 를 개발하는 방법에 의거하여 개발을 진행해보도록 하겠습니다. [모달창 UI 만드는 방법] 1. HTML 로 미리 디자인 해놓는다. 2. 숨겨 놓는다. 3. 버튼을 눌렀을 때 다시 보여준다. (이걸 JS 혹은 Jquery의 이벤트 리스너로 해결) [ 1. HTML 로 미리 디자인 해놓는다 ] 클릭 했을 때 나오게 될 UI를 미리 만들어 놓아야 합니다. 이번 navbar 를 만들때는 부트스트랩의 List-Group 을 사용하겠습니다. https://getbootstrap.co..
오늘은 Navigation Bar를 만들어 보겠습니다! Bootstrap 등을 활용하여 쉽게 제작이 가능하지만 HTML/CSS 를 활용하여 먼저 어떻게 만들어지는지 알아보겠습니다. NavBar 란? 무료 백과 사전, 위키피디아에서 내비게이션으로 이동검색으로 이동 네비게이션 바 (또는 네비게이션 시스템은 )는의 한 부분이다 그래픽 사용자 인터페이스 정보를 액세스하는 원조 방문자 의도. 탐색 모음은 파일 브라우저 , 웹 브라우저 및 일부 웹 사이트의 디자인 요소로 구현 됩니다. [1] 네 저도 무슨 소린지 모르겠습니다. 웹사이트 들어가면 상단에 나와있는 메뉴바를 Navbar라고 칭합니다. 지난번 [실습1-블로그 글목록] 만들기의 윗부분에 NavBar를 추가해보겠습니다. 오늘의 Target ☞ 사이트 상단에 ..