Today : 26
Yesterday : 116
Total : 857,076
«   2021/09   »
      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    
Archives
Today
26
Yesterday
116
Total
857,076
관리 메뉴
프로필사진 방명록
Today:26     Yesterday:116     Total:857,076

호기심 가득! 모지모지!

이거하나면 왠만한 상단네비게이션 완벽 해결! 본문

IT디자인 | 늘배우는자세

이거하나면 왠만한 상단네비게이션 완벽 해결!

2016. 4. 7. 17:16
728x90

 아! 왠지 득템한거 같은 기분이군요.

제이쿼리니 자바스크립트니 이리저리 해메다

기가 막힌 소스를 구했네요.

 

CSS파일로만 구성된 상단네비게이션입니다.

 

원래는 반응형 메뉴라서 다른 스크립트나 이런게 연결되어있었는데.

다 걷어내고, 메뉴 구현 부분만 남겨두었습니다.

 

인터넷 검색을 잔뜩하다 받은거라 어디서 구한건지

잊어버렸군요.ㅜㅜ.만드신분께는 죄송~

 

 

소스를 수정하다가

처음 보는 속성을 접해봤습니다.

transition란 건데... 오버시 속성이 적용되는 시간을 조절할 수 있다는거 같네요.

 

저는 이 소스에서

메뉴 오버시 색상변화하는 속도를 살짝 변경해봤습니다.

transition: all .5s ease-out;

 

다운받고 확인해보시면 어떤건지 금방 알 수 있어요~

 

 

 

 암튼, 조금만 응용할 줄 안다면 왠만한 상단네비게이션은 다 만들어낼 수 있는거 같네요.

깔끔한 메뉴소스 올만에 보네요!

 

다만 CSS로 구현되서 화려한 애니메이션이 있거나 하진 않습니다.

 

 

파일다운로드는 요기요~!

상단메뉴3단.zip

 

 

추가로 찾은 사이트입니다.

http://blog.naver.com/jyh0528/220295629856

이곳에 엄청난 보물들이~~ 참고로 CSS를 조금 다룰줄 아셔야 합니다.

 

추가로 찾은 파일

Mega Drop Down Menu.zip

요거 역시 CSS를 좀 아셔야 합니다.

 

 

 

무지!

공감하신다면 공감버튼 꾸욱~!!!!

 

728x90
댓글달고 친해지기 (1)
댓글쓰기 폼