[Svelte] 스벨트 9장 Motion


[Svelte] 스벨트 9장 Motion

Tweened 옵션 설명 delay 시작 전 딜레이 duration 지속 시간 easing 효과 (EX: cubicOut) interpolate 사용자 정의(from, to) = t = 임의 값 사이의 보간을 위한 값 함수. 기본적으로 Svelte는 숫자, 날짜, 동일한 모양의 배열과 객체 사이를 보간합니다(숫자와 날짜 또는 기타 유효한 배열과 객체만 포함하는 한). (예를 들어) 색상 문자열이나 변환 행렬을 보간하려면 사용자 정의 보간기를 제공하십시오. <script> import { tweened } from 'svelte/motion'; import { cubicOut } from 'svelte/easing'; const progress = tweened(0, { duration: 400, easing: cubicOut }); </script> <progress value={$progress}></progress> <button on:click="{() => progress.s...


#motion #svelte #모션 #스벨트 #스벨트모션 #스벨트애니메이션 #스벨트이펙트 #애니메이션

원문링크 : [Svelte] 스벨트 9장 Motion