最後のコマフレームを他のコマフレームより一定時間長めに表示させてからループさせたい
cssアニメーションを用いてテキスト画像を1文字ずつ表示させるように実装したのですが、今の状態では、最後のコマが表示されてすぐループを始めてしまう状態です。cssアニメーションに関しては最近勉強を始めたばかりで左も右もわからず・・・。どのように手を加えたらよいかご教示いただけますでしょうか・・・。
該当のソースコード
html
1<p class="btn01"><a href="#"><img src="images/txt.png"></a></p>
css
1.btn01 img { position: absolute; top: 0; left: 0; animation: test01 1s steps(8) infinite; } 2@keyframes test01 { 3 0% { margin-top: 0px; } 4 100% { margin-top: -400px; } 5}
補足情報(FW/ツールのバージョンなど)
・50px毎に1文字ずつ表示させています
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/03/03 12:52
2019/03/03 13:12