타쿠꺼

16.06.07 본문

Daily Study

16.06.07

kimtaku 2016. 6. 7. 12:27

네비게이션 만들기



1. 스크립트 animate 사용을 지양하였다.

2. css 트랜지션을 이용하여 스크립트로는 클래스를 주고, 빼면서 자연스럽게 트렌지션으로 애니메이션 효과를 줬다.

3. setTimeout으로 메뉴를 마구 눌렀을 때, 겹치는 현상을 방지하였다.


크로스 브라우저를 위해선 animate 사용을 해야겠지만.. 어차피 몇년 뒤면 IE 구버전은 사라질것이다.




z축 스크롤


1. body의 높이를 적당히 크게 설정한다.

2. translateZ와 perspective를 이용하여 position: absolute로 한곳에 여러개를 배치한다.

3. 스크롤에 따라 동적으로 translateZ의 크기를 각각 변화시킨다.

'Daily Study' 카테고리의 다른 글

16.06.10  (0) 2016.06.10
16.06.08  (0) 2016.06.08
16.06.05  (0) 2016.06.05
16.06.01  (0) 2016.06.01
16.05.31  (0) 2016.05.31
Comments