[slick] slick 슬라이드 배경 scale 효과

 

See the Pen WNrYbqv by wao816 (@hy16) on CodePen.

codepen 0.25사이즈로 결과값 확인해주세요!

 

gnb 메뉴는 글씨를 영문/한글 둘다 써서 높이값을 이용하여

마우스 hover했을 때  transformtransform:translateY(-85px); 가 작동하며

아래에 있던 한글 gnb 메뉴 글씨가 보이게 한다.

 

slick 슬라이드는 처음 background-size를 100% 으로 주고

.active 됐을 때 100% 로 설정하면 점점 줄어드는 효과가 생긴다.

(html에서 script는 마지막 태그 하단에 작성하였습니다.)