rree リーリー
私がやりたいのは、入力アニメーションを使用してユーザーにテキストを 1 行ずつ上から下に表示することです。多くのことを試しましたが、keyframe 要素ごとに異なる p.text を定義する以外の解決策が見つかりません。 p.text 要素が 17 個あるため、コードはスパゲッティのように見えます。私は何をしますか？
この問題の codepen リンクは次のとおりです: https://codepen.io/mehmetguduk/pen/RwJqzpN
P粉9039692312024-04-01 09:34:09
各行に手動で遅延を適用する必要があります。 SCSS の場合、これを行うコード スニペットの例は、@for ループを使用し、インデックスにアニメーションの継続時間を乗算することです。
もちろん、完璧なタイミングを実現するには追加の調整が必要になりますが、この問題を解決する方法の大まかなアイデアは得られるはずです。
アニメーションの状態も both に設定されていることを確認してください。これにより、テキストは最初は非表示になり、アニメーションが終了した後も表示されたままになります。