댓글 검색 목록

[design] SVG Animation with Sliders

페이지 정보

작성자 운영자 작성일 20-02-24 14:27 조회 757 댓글 0

슬라이더 데모가 있는 Kenneth Aamås의 아름다운 SVG 애니메이션은 Sass와 JavaScript를 모두 사용하여 똑똑하고 사용자가 제어하는 ​​효과를 얻습니다.


https://codepen.io/knekk/pen/BOjRbE 


페이지 하단에 있는 세 개의 슬라이더를 사용하여 이미지의 크기를 변경할 수 있습니다. 

각 슬라이더는 사용자가 슬라이더의 위치를 ​​변경할 때 움직이기 시작하는 이미지의 다른 부분에 연결됩니다.

이 애니메이션의 경우 제작자는 키 프레임 애니메이션 대신 전환 CSS 속성을 사용하여 미묘한 효과를 냅니다.


댓글목록 0

등록된 댓글이 없습니다.

웹학교 로고

온라인 코딩학교

코리아뉴스 2001 - , All right reserved.