appear box
- 박스 보이기/숨기기 제어
- css 애니메이션은 https://daneden.github.io/animate.css/ 를 참고
- jquery 불필요
dependency
- TimerChain.js
https://github.com/mins01/js_TimerChain
construct
- var ab = new AppearBox(document.getElementById('box1'));
methods
- .contentHtml(htmlString[,delay=0])
- .contentText(text[,delay=0])
- .show([delay=0,[showAnmation=this.showAnmation]])
보이기 동작 함수 추가
- .hide([delay=0,[hideAnmation=this.hideAnmation]])
감추기 동작 함수 추가
- .add(function,delay)
동작 함수 추가
- .clear()
동작 함수 전부 삭제
- .stop()
연속 동작 중지
properties
- .showAnmation = 'bounceIn'
보일 때의 애니메이션 타입
- .showAnmation = 'bounceOut'
감출 때의 애니메이션 타입
- .box
최 외각 node. class on 을 추가하여 보이고, 안보이고를 결정. class = appear-box
- .fence
애니메이션 적용 node. class = appear-box-fence
- .content
.contentText() , contentHtml() 에 적용하는 node. class = appear-box-content
- .tc
TimerChain
etc
- 애니메이션 타입 목록 https://daneden.github.io/animate.css/ 참고
- delay=-1 이면, setTimeout 없이 바로 실행