WEB/HTML,CSS,JAVASCRIPT

[CSS] 타이밍 함수 ease-in / ease-out 차이점

solutionMan 2022. 1. 23. 14:59
반응형

CSS3의 전환 및 애니메이션은 공식적으로 “타이밍 함수”라고하는 여유를 지원합니다. 일반적인 사람은된다 ease-in, ease-out, ease-in-out, ease,과 linear하거나 사용하여 자신을 지정할 수 있습니다 cubic-bezier().

  • ease-in 애니메이션이 천천히 시작되고 최고 속도로 끝납니다.
  • ease-out 애니메이션을 최고 속도로 시작한 다음 천천히 완료합니다.
  • ease-in-out 느리게 시작되고 애니메이션 중간에서 가장 빨라진 다음 천천히 완료됩니다.
  • ease처럼 ease-in-out이 빨리 종료보다 약간 시작 제외.
  • linear 여유를 사용하지 않습니다.
  • 마지막으로 구문에 대한 훌륭한 설명  cubic-bezier있지만 매우 정확한 효과를 원하지 않는 한 일반적으로 필요하지 않습니다.
반응형