애니메이션 딜레이
261
작성한 질문수 6
안녕하세요! 덕분에 재미있는 로딩 css 애니메이션 배웠습니다:)
아무래도 애니메이션 딜레이가 있다보니 제일 처음 애니메이션이 실행 될때 네모박스가 늦게 출발하는 부분이 있어 부자연 스러워 보이더군요..
사용자가 화면을 보았을때 두번째 네모박스가 한박자 늦게 출발 하는 모습을 보여주기 싫다면 어떠한 방법이 있을까요~?
제가 설명을 잘 못해서 ㅠㅠ 혹시라도 추가적인 설명이 필요하시다면 말씀 부탁드립니다!
답변 1
3
animation-delay로 하면 2번째 박스가 늦게 출발해서 좀 어색하죠.
로딩에 쓰이는거라 순식간에 지나가서 유저가 느끼기 쉽지는 않지만 좀 더 퍼펙트하게 만들고 싶으시면...
keyframe을 하나 더 만드세요.
기존으니 keyframe을 복사하셔서 이름을 바꾸시고 복사된 키프레임은 우측 하단 부터 시작을 시키는거에요.
곧, 2번째 박스에 적용되는 2번째 키프레임의 시작은 첫번째 키플레임의 50%에서 시작하시는거에요.
그러면 시작위치가 둘다 다르니까 늦게 출발하는 어색함을 잡으실거에요~^^
class 값 한 번에 부여하는법
2
80
1
@media에서의 flex-direction: column으로 세로배치 관련 질문드립니다.
1
69
1
div#css-checker-widget의 해결방
1
60
2
input의 포커스되었을때 검정선이 사라지지 않아요
0
79
2
강의듣는법
1
74
1
아코디언 만들기 100%이하의 화면으로 보았을때
1
68
2
input checked 질문합니다.
0
76
1
Bracket Pair Colorizer - 비주얼 스튜디오
1
140
2
Part 1 영상 안나옵니다
1
89
1
제이쿼리 작동이 안됩니다
1
199
3
강의 내용 질문있습니다.
1
120
2
일정 부분만 주석하는 방법
1
211
2
폰트어썸
1
134
2
인접선택자에 대한 질문드립니다!
1
129
2
delay 적용 안됨
1
134
1
rotateY(360deg)가 적용이 안됩니다!
1
186
2
세로이동할때 height값
1
138
2
폰트어썸이 안되요..
1
486
2
화면 정중앙에 오게끔 할수있나요?
1
169
1
어코디언 네비게이션 중
1
127
1
라이브서버 문제
1
230
2
넷플릭스 어코디언 예제 질문
1
105
1
이번 강의에선 display flex가 무조건 적으로 필요한건가요 ?
1
157
1
active 관련 질문
1
147
2