그림 CSS3 노트 4 애니메이션
1105 단어 animation
1. animation-name 키프레임 이름
2.animation-duration 시간
3.animation-timing-function 애니메이션 함수
4. animation-delay
5. animation-interation-count 주파수number | "infinite"
6. animation-direction 방향 normal | altername (짝수: 순서 재생, 홀수: 거꾸로 재생)
7.animation-paly-state 재생 상태running|pause
8. animation-fill-mode 설정 시간 외 속성 none(끝날 때 초기로 반전) | forward(끝날 때 마지막 프레임 보존) | backword | both
키프레임 정의:
@keyframes framesName {
from | 0% {
...
}
10%, 20%, 30% {
...
}
to | 100% {
...
}
}
/* Demo */
animation: framesName 1s liear
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
How to make animation on scroll ?There have so many animation for icon scroll, but today we will do animation type arrow run down like animated last post...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.