質問編集履歴

2

補足しました

2019/07/29 10:35

投稿

saayan
saayan

スコア12

test CHANGED
File without changes
test CHANGED
@@ -28,7 +28,7 @@
28
28
 
29
29
 
30
30
 
31
- そこで、➀のフラッシュが終わったタイミングで「.flash」を削除したいのですが、どうしたらできますでしょうか?
31
+ そこで、➀のチカチカが終わったタイミングで「.flash」を削除したいのですが、どうしたらできますでしょうか?
32
32
 
33
33
 
34
34
 
@@ -213,3 +213,7 @@
213
213
  });
214
214
 
215
215
  ```
216
+
217
+ ###補足
218
+
219
+ 「.flash」を削除したいのは、➀のチカチカが終わったタイミングです。

1

質問内容をわかりやすく変更しました

2019/07/29 10:35

投稿

saayan
saayan

スコア12

test CHANGED
@@ -1 +1 @@
1
- cssアニメーションを繰り返したくない
1
+ CSSアニメーションが終わったときにクラス削除する方法
test CHANGED
@@ -1,6 +1,6 @@
1
1
  ###実現したいこと
2
2
 
3
- CSSのフラッシュアニメーションの実行、1回だけにしたいです。
3
+ CSSアニメーションが終わったを見計らって、アニメーションのためのクラス削除したいです。
4
4
 
5
5
 
6
6
 
@@ -8,7 +8,7 @@
8
8
 
9
9
 
10
10
 
11
- 問題の概要としては、フラッする要素が一度隠れた後に現れると、フラッが再び実行されてしまう点です。
11
+ 問題の概要としては、アニメーョンする要素が一度隠れた後に現れると、アニメーョンが再び実行されてしまう点です。
12
12
 
13
13
 
14
14
 
@@ -24,7 +24,11 @@
24
24
 
25
25
 
26
26
 
27
+ この2回目のチカチカが不要です。
28
+
29
+
30
+
27
- この2回目のチカチカ不要なのですが、どうすれば➀のときだけにできますでしょうか?
31
+ で、➀フラッシュ終わったタイミングで「.flash」を削除したいのですが、どうしたらできますでしょうか?
28
32
 
29
33
 
30
34
 
@@ -209,47 +213,3 @@
209
213
  });
210
214
 
211
215
  ```
212
-
213
- ###試したこと
214
-
215
- CSSで「fill-mode」を追加しましたが、効果ありませんでした。
216
-
217
- ```css
218
-
219
- .box.animated.flash {
220
-
221
- -webkit-animation-duration: 1s;
222
-
223
- animation-duration: 1s;
224
-
225
- -webkit-animation-name: box_flash;
226
-
227
- animation-name: box_flash;
228
-
229
- }
230
-
231
- ```
232
-
233
-
234
-
235
- ↓ 追加したけど効果なし
236
-
237
- ```css
238
-
239
- .box.animated.flash {
240
-
241
- -webkit-animation-duration: 1s;
242
-
243
- animation-duration: 1s;
244
-
245
- -webkit-animation-name: box_flash;
246
-
247
- animation-name: box_flash;
248
-
249
- -webkit-animation-fill-mode: forwards;
250
-
251
- animation-fill-mode: forwards;
252
-
253
- }
254
-
255
- ```