아아아아 으아아아
내가 원하는 것은 여기에 입력 애니메이션을 사용하여 위에서 아래로 한 줄씩 텍스트를 사용자에게 표시하는 것입니다. 여러 가지 방법을 시도했지만 각 p.text
元素定义不同的 keyframe
之外,我找不到其他解决方案。这样我的代码就变成了意大利面条,因为有 17 个 p.text
요소를 제외하고는 아무것도 시도하지 않았습니다. 나는 무엇을 해야 합니까?
이 질문에 대한 codepen 링크는 다음과 같습니다: https://codepen.io/mehmetguduk/pen/RwJqzpN
P粉9039692312024-04-01 09:34:09
각 행에 수동으로 지연을 적용해야 합니다. SCSS의 경우 이를 수행하는 예제 코드 조각은 @for
루프를 사용한 다음 인덱스에 애니메이션 지속 시간을 곱하는 것입니다.
물론 완벽한 타이밍을 얻으려면 약간의 추가 조정이 필요하지만 이 문제를 해결하는 방법에 대한 대략적인 아이디어를 제공해야 합니다.
애니메이션 상태도 both
로 설정되어 텍스트가 처음에는 숨겨지고 애니메이션이 끝난 후에도 계속 표시되는지 확인하세요.
JavaScript를 사용하여 다음과 같이 애니메이션 지연을 설정할 수도 있습니다.
으아악