(html / css / jquery) slick 슬라이더 animation 적용 예제

slick.js

See the Pen slick 슬라이드 애니메이션 적용 (slick slide animation css) by kimyangsun (@kimyangsun) on CodePen.

https://codepen.io/kimyangsun/pen/bGdBJOy

 

 

slick 슬라이더의 내부 텍스트에 애니메이션을 준 소스코드입니다.

 

여기서 주의할 점은 애니메이션을 slick-slide에 slick-active 클래스가 들어갈때마다 넣어주었기 때문에 slick-active 와 

 

연관지어서 css를 작성해야 합니다.

 

단, 주의할 점이 있습니다.

 

각각 문장마다 애니메이션 딜레이를 다르게 주거나 하고싶다면 각각 animation-delay css를 주어야 한다는 부분입니다.