타쿠꺼
16.06.11 본문
이미지 네비게이터 만들기
1. 스크롤바를 사용할 경우, HTML구조와 CSS에 신경을 써야 한다.
2. 안보이는 곳에서 보이는 곳으로 애니메이션 되면서 동시에 fade를 주니까 깜빡이는 현상이 있더라.. 이유는 모르겠음.
3. 원래 중복되는 코드는 함수를 따로 만들어서 사용하는게 매우 효율적임. 여기에서는 좌,우 이동이 중복되기 때문에 함수로 만들면 됨.
4. load 이벤트를 사용할 때 주의할 점은, load의 콜백메서드는 load가 완료된 후 불린다는 것. 그래서 load로 체이닝 하는 경우엔 load 뒤에 붙은 jquery메서드들이 당연하게도 load콜백보다 먼저 실행된다는 점을 잊으면 안됨.
5. fadein,out에도 콜백메서드 붙일 수 있음. jquery의 이펙트들은 전부 콜백메서드 붙일 수 있음.
6. 이미지 리사이징 하는법 잘 새겨 봐야함.
7. bottom: 0 주고 height: 100%로 애니메이션 하면 아래에서 위로 쭉 올라옴.
8. width, height의 %속성은 부모컨테이너의 크기에 대한 비율로 생성됨.
9. 부모컨테이너를 포함하는 wrapper 컨테이너의 중요성이 크고 css 다룰 때 편리하게 해줌.
흩날리는 박스 만들기
1. 애니메이션 중일 때에는 버튼 동작 안하게 is(:animated) 사용했다.
2. 배열에 원소 넣기 push()
가로 스크롤
1. animate 속성에 scrollLeft, scrollTop 속성을 이용해서 스크롤할 수 있다.
2. 보통 스크롤 할 때에 $("html, body") 많이 쓰는 것 같다.